Is greensock useful for an auto-deploy menu

[C.Surieux]

Hello,

 

The design of my site include a floating menu built with bootstrap.

 

On landing page which is a kind of one page site with 8 areas, the menu stays static on the bottom of screen, so when the content scrolls, part of this content is hidden by the fixed menu.

I would appreciate to be able to reduce its width from all the width to a round image on its left. Clicking the image would deploy horizontally the menu bar on/off.

 

On others pages it behaves more as a fixed top bootstrap menu but with a  height which eats part of the page. Here I would appreciate to have it automatically reducing it height when the mouse is not over its area. But I want to keep all this cool enough to avoid trying to click on already reduced part of it.

 

I hope my explanations are clear.

 

Thanks for a direction to start.

[PointC]

Hi C.Surieux 

 

I'm not 100% sure what your question is, but GreenSock is very useful for any type on animation you want to do. If I'm understanding your desired outcome, scaling menu height on hover or sliding menus on/off screen by clicking an image is no problem at all. 

 

If you're asking how you start your project, I'd say just put together all the basics of the page/site with some plain divs, placeholder text and the <ul> or however you're designing the menu. I wouldn't worry about final styling on anything until the animations are the way you want them.

 

If you haven't visited these pages yet, I'd take a look at them to get an understanding of the basics:

http://greensock.com/get-started-js 

http://greensock.com/jump-start-js

 

If you have specific problems as you're setting up the animations, everyone around here will be happy to assist you. A CodePen will always get you the best answers.

http://greensock.com/forums/topic/9002-read-this-first-how-to-create-a-codepen-demo/

 

Hopefully that helps a little bit as you get started with your site.

 

Happy tweening.