Hello My Webpage has three main components(rather divs)
1: top div that has some icon images(inside topmenu div)
2: left div containing navigation links is scrollable
3: right or main content where the actual content appears, This is actually a single page where the content will be displayed according to what is clicked in the left div(navigation)
I want my icon images that are in the top divs to remain fixed. I tried using
position:fixed; for div contaning icon images, but it didn't work, now when I fixed the top div the contents of right div are scrolling over the top div.
Can you guys tell me what do I need to set the icon images inside top div to remain fixed. so that they are not covered up when I scroll the right page or main page.
Part of my code is below:
<p>I am in the top rectangular box</p>
<div id="topmenu">/* I want these to remain fixed*/
<li><a href="#" title="pdf"> </a></li>
<li><a href="mailto:test@Gmail.com" title = "email"> </a></li>
<li><a href="#" title="print"> </a></li>
Thanks for your effort, I was again unable to upload html file, but I have attached 2 notepad fiels, html and css separately. I hope you can infer them. If you paste them in your editor(notepad++ in mycase). I am sure you would be able to preserve the syntax highlights for your ease.
Thanks a ton, Mr. Baggins. I am sure I needed something like this, but I am still not sure if my icons would remain fxed coz they lie inside the div that you have kept fixed, as I am still out of time to run the script.
I don't know half of you half as well as I should like; and I like less than half of you half as well as you deserve.
- Bilbo Baggins in The Fellowship of the Ring
It uses a lot of jquery, Infact I have added some special fonts(cuffon et-al) to it. I don't know what this effect is exactly called, but I can roughly point you to Microsoft website, you can see. those beautiful effects like when you click (highlights, latest releases, using your computer, for business, for developers, for IT..), how the content changes towards right side of the page.
I am looking to achieve the same effect like when you click home, projects, hobbies, education on my page, It should achieve the same effect.
I want my page to achieve this effect but I am still digging it.
Though on MS this effect is achieved on hovering the mouse, I want this effect to happen on clicking on my web page.