Trouble with parallax scrolling - html

So I have this website in the works and the header image uses a parallax plugin. How can I make the nav bar with the links "Inspiration," "My Work," etc...move with the header image as you scroll down. Any help would be greatly appreciated.
(Sorry, I'm new to writing code for websites and yes I am using weebly and it can be terrible but it'll have to do. I am able to upload javascript files and link to them through CSS and HTML)

you need to use css. position: fixed. It would be more easier to help you if you posted your code.

add the following like of code to your css file in the header's styling section.
position: fixed
or check this tutorial for a complete tutorial
http://www.cssreset.com/creating-fixed-headers-with-css/
Regards
Shiva

Related

Navigation bar hiding web page contents and sidebar contents in html

I'm making a web page to try to learn HTML, CSS, PHP, and Javascript better. I've been revisiting the code trying to work out a few bugs and I discovered that my search bar is hiding the page contents and a button on my sidebar. I spent about 10 to 11 hours this week to try to fix the problem. The thing is though I'm not sure what the problem is and so I don't know which part of my code to post. All I need help with is identifying a few possible problems. If you have an idea what the problem might be I would really appreciate your help. So far none of my ideas have worked.
Here is a picture of what the page currently looks like.
Can you try adding a css property of padding-top: 100px; to the content under the header and see if that does anything?
from the diagram it looks as if your search bar has been removed from the normal document flow. This is usually done in CSS setting the position attribute to absolute or fixed rather than static or relative.
Check your styling for position and set it to static or relative.

CSS and html design for news feed like div

I'm trying to recreate this image below in html and css, but I'm not sure how to get the vertical line to stay underneath the icons. Any help would get me started.
Please visit this link to see image:
Have a look at Vertical timeline -
The code uses a bit of JQuery as well as CCS3 (not sure if that would be OK for you)

The content on my Tumblr theme completely disappears

For some reason the content on my Tumblr theme doesn't show up, which is very frustrating. Sometimes it will show for a split second and then vanish. I have NO idea what could be causing this. I can't post the entire theme code in here, since I don't know where the error could be, so I've put the layout code into Pastebin.
Here is the link to the Tumblr itself.
Any advice would be greatly appreciated as the theme looks perfect when it chooses to show up. :/
Remove the bottom: 1%; from the body tag.

Need help creating a header with a clean navigation

Can someone help me figure out how to create the navigation displayed in the header on top of this page?
http://themes.iki-bir.com/ikaros/
If someone could give me some direction to learning how to make these types of navigations, I'd really much appreciate it.
Use This dropdown menu plugin, its a Jquery css dropdown plugin which uses jquery and css both...
You have to do some changes to the js and css to try make it as similar as possible...
http://www.saptarang.org/jquery-css-dropdown-menu-2-levels
Thank you...

CSS3 Page Curl Shadows

I'm trying to give the footer of a webpage I'm designing a css3 page curl shadow effect. I've found guides online and I think I've mostly modified the code to my situation, but I'm still having some problems. When I set the before and after to position: absolute (like the guide does), it makes my footer's background/background color disappear.
Here's a link to the jsfiddle: http://jsfiddle.net/a9ns7/1/
Any ideas?
If you're willing to employ jQuery, there is a useful plugin for applying interesting corner effects on elements...I'm sure you could work on this to make it seem like a page turning.
Found out I just needed to add a defined width to the footer_container div. Thanks for the answers.