Jumat, 17 Agustus 2012

How to Create Float Image in Blogspot

Meet again with the trick-id, in this post I will explain about floating image i the blog.
Float Image, maybe you've seen the float image. Float Image is an image that floated in the blog, pictures are always in place even though the blog on the scroll. For clarity, the following are examples of the float image, the example here



You see this picture?



That is the float image, if you want to create and put it in your blog, I will explain in this post.
How to Create Float Image :
1. Login to your Blogger Account
2. Goto Design(Layout) -> Edit HTML
3. In your template, put this code above code ]]></b:skin>
#float_image {
position:fixed;_position:absolute;bottom:0px;left:0px;clip:
inherit;_top:expression(document.documentElement.scrollTop+document.documentElement.clientHeight-this.clientHeight);_left:expression(document.documentElement.scrollLeft + document.documentElement.clientWidth - offsetWidth);}

the code with red colour are the position of the image, you can change it to right, left, bottom, and top

4. Then, put following code before </head>
<div id="float_image">
<a href="http://trick-id.blogspot.com"> <img src="
http://i496.photobucket.com/albums/rr329/grandisyf/74.gif" border="0" /></a>
</div>

http://trick-id.blogspot.com is image link and http://i496.photobucket.com/albums/rr329/grandisyf/74.gif is the image url, change it with yours

5. The last steps is click Save Template

Now See the result, float image is in your blog
Share this post
  • Share to Facebook
  • Share to Twitter
  • Share to Google+
  • Share to Stumble Upon
  • Share to Evernote
  • Share to Blogger
  • Share to Email
  • Share to Yahoo Messenger
  • More...

0 komentar

:) :-) :)) =)) :( :-( :(( :d :-d @-) :p :o :>) (o) [-( :-? (p) :-s (m) 8-) :-t :-b b-( :-# =p~ :-$ (b) (f) x-) (k) (h) (c) cheer

 
© 2011 clickjojocyber
Designed by BlogThietKe Cooperated with Duy Pham
Released under Creative Commons 3.0 CC BY-NC 3.0
Posts RSSComments RSS
Back to top