In blog ,sometime our content is so long ,and it will break the proportion of our layout . But we can't divide post into shorter posts . What should we do now ? we can add a textbox for content and a scrollbar in the right side for sliding up and down . But we can do more than that .
Let's see the demo here .
When your mouse is on button "up" ,the content is scrolled up ,and when mouse is on "down " ,content is scrolled down .
To make scrolling content like this ,follow this steps :
1,Login to your Blogger account . Go to Layout . Go to Page elements .
2,Create a HTML/Javascript Widget .
Paste the code bellow into widget content :
var speed = 5;
var height = 250;
#easyscroll{
background:#eee;
margin:1em 0;
/* add additional styling */
}
/* easyscroll navigation buttons */
#easyscrollnav, #easyscrollnav li{
height:28px;
line-height:28px;
margin:0;
padding:0;
}
#easyscrollnav{
margin:1em 0;
}
#easyscrollnav li{
list-style:none;
float:left;
background:#eee;
margin-right:10px;
padding:0 10px;
color:#333;
cursor:pointer;
}
#easyscrollnav li.over{
color:#999;
text-decoration:underline;
background:#ccc;
}
...........
Content
...........
in this code , variable speed = 5; is speed of scrolling and variable height = 250; is height of content widget .
..........
Content
..........
is what will be showed in Scrolling content box . So you change it to your own .
Save setting .You are done .
Browse: Home > make scrolling content in blogger
0 Comments:
Post a Comment