Share Ok!

campuran

Sabtu, 21 Februari 2015

Botton back to top

Step1:

  • Log in to your Blogger Account.
  • Then go to Dashboard >> Layout >> Add a gadget.
  • Then select HTML/JAVASCRIPT from the list.
  • Copy and paste the below code in the content box and then save it.
Note: If above steps doesn't work for you then follow STEP 2.

Step2:

  • Go to Dashboard >> Template >> Edit HTML.
  • Press CTRL+F and search for the following code:
</body> 
  • Paste the below code just above </body> tag.
Code:

<!--Blog Genes back to top widget Start-->
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'></script><script type='text/javascript'>$(function(){$(window).scroll(function(){if($(this).scrollTop()!=0){$("#rb-top").fadeIn()}else{$("#rb-top").fadeOut()}});$("#rb-top").click(function(){$("body,html").animate({scrollTop:0},800);return false})});</script><a href="http://bloggenes.com/"></a><a id='rb-top' style='display: none; position: fixed; bottom: 1px; right:0%; cursor:pointer;font:12px arial;'><img src='http://2.bp.blogspot.com/-lJ3KriuHV98/T_luCw1I2JI/AAAAAAAAAkY/8x8SXw5Ds4s/s1600/rb+back+to+top+8.png' width="50px" height="50px"/></a>
<!--Blog Genes back to top widget End-->

Customizations:

  •   Replace image URL with the URL of the button you have selected.
  •   To change the size of the button edit pixel values shown in blue color.
  •   To change the position of the button replace the text "right" with "left".

Back To Top Buttons:

Arrows:

Arrow1:
URL:
 http://1.bp.blogspot.com/-_tjCJPDuf34/Ue5WwvYfJpI/AAAAAAAADfw/9D5IJ3RrP2Q/s1600/arrow1.png
Arrow2:
URL:
http://4.bp.blogspot.com/-wbyrFu6Vhpc/Ue5W5BLpfwI/AAAAAAAADf4/BqSnh1aQvxg/s1600/arrow2.png
Arrow3:
URL:
http://3.bp.blogspot.com/-8bbk-IMM5DI/Ue5W_AnHIWI/AAAAAAAADgA/TCr2XUEHWu4/s1600/arrow3.png
Arrow4:
URL:
 http://1.bp.blogspot.com/-rcsHlnu6AB4/Ue5Za6wSdZI/AAAAAAAADgQ/yacL81A289A/s1600/arrow4.png
Arrow5:
URL:
 http://3.bp.blogspot.com/-YeFQHHxvsuw/Ue5ZpFkawJI/AAAAAAAADgY/vgBi07CMo34/s1600/arrow5.png
Arrow6:
URL:
 http://3.bp.blogspot.com/-VF_Vlt4pO0E/Ue5Z4F-ey7I/AAAAAAAADgg/EsGVe4BneTM/s1600/arrow6.png
Arrow7:
URL:
http://3.bp.blogspot.com/-yB7C5JCnGCc/Ue5aTjZgIfI/AAAAAAAADgo/LS9ra84T8O8/s1600/arrow8.png

Square Box: 

Sq box1:
URL:
http://3.bp.blogspot.com/-_CIImkyJgU4/Ue5awhlxS2I/AAAAAAAADgw/e6k_pQX7xr4/s1600/square1.png
Sq Box2:
URL:
http://2.bp.blogspot.com/-HglpLWgOcKo/Ue5a_-vxwyI/AAAAAAAADg4/XdUwEIsdP-o/s1600/square2.png
Sq Box3:
URL:
http://4.bp.blogspot.com/-fyP-AN7e6PY/Ue5bRLmodiI/AAAAAAAADhA/mbqS_yVTANM/s1600/arrow7.png
Sq Box4:
URL:
http://4.bp.blogspot.com/-MvQiLyMP3f4/UgJNTvuXwGI/AAAAAAAAERE/_rqk4LcbecI/s1600/1uparrow.png

Round Button:

Round Button1:
URL:
http://1.bp.blogspot.com/-NDaR3TmDuWs/Ue5b0ZZGZvI/AAAAAAAADhI/CZ-XxbpozRQ/s1600/circle1.png
Round Button2:
URL:
http://1.bp.blogspot.com/--zBsvX3NSv4/Ue5cGmw5zoI/AAAAAAAADhQ/wbjk-qP1BbM/s1600/circle2.png
Round Button3:
URL:
http://1.bp.blogspot.com/-Tm7RZt74U64/Ue5caMkFUUI/AAAAAAAADhY/dSRLpoXBThk/s1600/circle3.png
Round Button4:
URL:
http://4.bp.blogspot.com/-l2GV3PuBaws/Ue5coG_FmFI/AAAAAAAADhg/1nySNe1wFb8/s1600/circle4.png
Round Button5:
URL:
http://1.bp.blogspot.com/-zOtFGFW183A/Ue5c2T_0fcI/AAAAAAAADho/CyL5KbEyxiw/s1600/circle5.png
I hope you will like these buttons.