Menu icon Foundation
Please advice about side bar and top bar

hi there,

i am very new for doing foundtion and coding aslo..

but i am challenging to create one website for my company..

however, would you guys please advise or let me hint for make fist landing page like this?
http://www.winshape.org/camps/get-ready/

1. how i make the top bar like this transparent and it changes with scroll to white or any other colors..
and also it is beautiful responsive top-bar..
2. how do i make full screen back ground with color filtered with transparent designed logo or font design?

3. any body know how to make mega menu top bar?
i found one theme but it is based bootstrap..

4. i couldnt find anywhere about side bar from foundation and i am plaining to make side bar on subpages..
would like to fixed and follow the scroll with some arrow?

I have been study and searching for web-design about 3weeks and made one basic top-bar that is all..
i am using SASS and set up last night and now i knew what is sass.. and how it works but still not friendly with scss codes.. do you knwo where i can find some style basic codes?

sorry for the poor english and lots of asking..

topbarnavbarheadersidebar

hi there,

i am very new for doing foundtion and coding aslo..

but i am challenging to create one website for my company..

however, would you guys please advise or let me hint for make fist landing page like this?
http://www.winshape.org/camps/get-ready/

1. how i make the top bar like this transparent and it changes with scroll to white or any other colors..
and also it is beautiful responsive top-bar..
2. how do i make full screen back ground with color filtered with transparent designed logo or font design?

3. any body know how to make mega menu top bar?
i found one theme but it is based bootstrap..

4. i couldnt find anywhere about side bar from foundation and i am plaining to make side bar on subpages..
would like to fixed and follow the scroll with some arrow?

I have been study and searching for web-design about 3weeks and made one basic top-bar that is all..
i am using SASS and set up last night and now i knew what is sass.. and how it works but still not friendly with scss codes.. do you knwo where i can find some style basic codes?

sorry for the poor english and lots of asking..

Rafi Benkual over 4 years ago

We can give some advice:

  1. Change top-bar color on scroll - http://codepen.io/anon/pen/vEgVQy

    • It's not transparent, rather looks like #fff with opacity
  2. Here is a full width background - http://codepen.io/kbjohnson90/pen/cEpkz - center center cover

  3. make the height: 100vh to fill the screen.

  4. top-bar mega - http://foundation.zurb.com/forum/posts/232-megamenu

  5. side bar - http://codepen.io/bouvet2014/pen/trCGK

Not sure what you SCSS/Sass question means. Can you explain that?

bratt over 4 years ago

hi ..

very much apreciate with your kindly responses, and few more questions..

so if i would want to use your provided codes, do i need to copy and paste?

and do i better change the original sass codes on your css comments? or better make new sass file such as custom.scss?

one more question for side bar.. menu i would like the side bar like fixed on top and expend height when sub menu shows, like dropdown..

please see here..

http://wrapbootstrap.com/preview/WB0B30DGR

if you let me know how to also make blockquote? like this sidebar?