+- Twitist Forums (http://twitist.com)
+-- Forum: Facebook forums (/forum-14.html)
+--- Forum: Facebook Pages (/forum-13.html)
+--- Thread: i dont want to scroll my logo and menu of my webpage can any one suggest how can i do this...? (/thread-104868.html)
i dont want to scroll my logo and menu of my webpage can any one suggest how can i do this...? - Piyush - 02-25-2014 12:28 AM
As many website like facebook i dont want to scroll my logo and menu bar, it should be on the top when the user scroll the page.. can any one help me which code should i use for it..
- Vilas - 02-25-2014 12:37 AM
its not more complicated, just scroll here
http://jsfiddle.net/sureshpattu/Ja3rp/
Thanks
- Matthew - 02-25-2014 12:47 AM
Look at fixed positioning in CSS:
http://www.w3schools.com/css/css_positioning.asp
- me2 - 02-25-2014 12:52 AM
I've done similar setups using frames, for example, a fixed banner along the top with a fixed navigation column at the left. Here's stripped-down example. Use the recommended file names, and place them in the same folder, then open Frames.htm.
————— ————— ————— ————— ————— —————
<html>
<!-- File name = Frames.htm -->
<head><title>Navigation and Content Frames</title></head>
<!-- The frameset divides the page in two rows.
The first row is 70 units tall. The second row
is divided into two columns, with the first 115
units wide, and the other extending the remain-
ing width of the page. The user can resize the
columns, as "noresize" isn't used -->
<frameset rows="70,*">
 <frame src="banner.htm"
 name="banner" noresize="noresize">
 <frameset cols="115,*">
 <!-- 1st column = nav links -->
  <frame src="Nav.htm"
  name="nav">
 <!-- 2nd column = content, initially "Yahoo" -->
  <frame src="http://search.yahoo.com"
  name="content">
 <noframes>
  <body>
  <blockquote>
  This feature uses frames, but your browser isn't displaying them.
  </blockquote>
  </body>
 </noframes>
 </frameset>
</frameset>
</html>
<!-- spaceId: 2114721203 -->
————— ————— ————— ————— ————— —————
<html>
<!-- File name = Banner.htm -->
<body>
<center><font size=5>BANNER</font></center>
</body>
</html>
<!-- spaceId: 2114721203 -->
————— ————— ————— ————— ————— —————
<html>
<!-- File name = Nav.htm -->
<head>
<style type="text/css">
a:link {color: #3333ff; text-decoration: none }
a:active {color: #3333ff; text-decoration: none }
a:visited {color: #3333ff; text-decoration: none }
a:hover {color: #3333ff; text-decoration: underline }
P {line-height: 0.92}
</style>
</head>
<body>
<center>
<p><a target="content" title="DogPile Search"
href="http://www.dogpile.com"> Dogpile</a>
<p><a target="content" title="Yahoo Search"
href="http://search.yahoo.com"> Yahoo Search</a>
<p><a target="content" title="Ask"
href="http://www.ask.com"> Ask.com</a>
</center>
</body>
</html>
<!-- spaceId: 2114721203 -->
- Shubhradeep M - 02-25-2014 12:56 AM
The Concept is called Sticky Header. Implemented by using css attribute 'Position:fixed' to the div you are keeping your logo in.