NOTICE

Adfly Links not working Find Direct Links HERE

Auto Horizontal Image Slider[Style 1] Using jQuery For Blogger Blog


Also visit 

Horizontal auto Image strip Scroller/Slider with speed control based on jQuery


Image slider is a widget or a pluggin by using which we can show several images on a specified area.

Hi guys here is another beautiful jQuery widget .This is an auto + click able vertical scroll Image or picture slider in any direction ( right or left ) direction.Further by using jQuery we make it more beautiful and light.Author is very creative( Credits are given below) he has given us three type of such image sliders they are all very beautiful and i will definitely try to introduce tutorial; to install them in your blogger blog easily first of all see the demo page below






Please Download Scripts And Upload in Your Own Server Then use Direct Links to files In Below Code.
Where To Upload These Scripts ?Click Here To Know :)









Installation :


I have simplified the installation to a great extent.It is just a 2 step work :)


Step 1:

This is the HTML part use this to Display images which you want to show in your image scroll area.

<div id="content">

<div id="slider">
<ul>       
<li><a href="http://templatica.com/preview/30"><img alt="Css Template Preview" src="http://3.bp.blogspot.com/_9UnRubulkWQ/St2nkPL76fI/AAAAAAAAAAY/8PVUeYOzaMg/01.jpg"/></a></li>
<li><a href="http://templatica.com/preview/7"><img alt="Css Template Preview" src="http://4.bp.blogspot.com/_9UnRubulkWQ/St2nklUGGXI/AAAAAAAAAAg/zR-mtLaO7E8/02.jpg"/></a></li>
<li><a href="http://templatica.com/preview/25"><img alt="Css Template Preview" src="http://3.bp.blogspot.com/_9UnRubulkWQ/St2nlE0TBlI/AAAAAAAAAAo/YZ8KjYS5Guc/03.jpg"/></a></li>
<li><a href="http://templatica.com/preview/26"><img alt="Css Template Preview" src="http://1.bp.blogspot.com/_9UnRubulkWQ/St2nlsFPgfI/AAAAAAAAAAw/LBcS1zw3UcY/04.jpg"/></a></li>
<li><a href="http://templatica.com/preview/27"><img alt="Css Template Preview" src="http://2.bp.blogspot.com/_9UnRubulkWQ/St2nmLn2TFI/AAAAAAAAAA4/4SWp0QRF6d4/05.jpg"/></a></li>   
</ul>
</div></div>
<span style="font-size:4px;"><a href="http://bloggerplugnplay.blogspot.com/" target="_blank">Plug it</a></span>










Step 2:


This is Java script part

Login your BLOGGER account And click on Layout in the sub menu click EDIT HTML

Now find ]]></b:skin>


Paste the below code Below ]]></b:skin> code


<script src='http://bloggerplugnplay-files.bravehost.com/jquery.js' type='text/javascript'/>
<script src='http://bloggerplugnplay-files.bravehost.com/easySlider1.7.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
$(&quot;#slider&quot;).easySlider({
auto: true,
continuous: true
});
});
</script>

<link href='http://bloggerplugnplay-files.bravehost.com/screen.css' media='screen' rel='stylesheet' type='text/css'/>




Save your Template !

Credits : Author: Css Globe Distributed for Blogger Blogger Plug n Play

12 comments :

  1. I cannot get this to work. For one, the HTML says there is a broken IMG tag, and the javascript doesn't work either.

    ReplyDelete
  2. http://bloggerplugnplay-files.bravehost.com/jquery.js

    Account over bandwidth

    ReplyDelete
  3. hi..


    i want the slider to stop on the hower...????


    can it be don

    ReplyDelete
  4. I all the time used to study paragraph in news papers but now as
    I am a user of internet therefore from now I am using net for content, thanks to web.
    My web page : home equity loan massachusetts

    ReplyDelete
  5. It's a shame you don't have a donate button! I'd certainly donate to this fantastic blog! I guess for now i'll settle for bookmarking and adding your RSS feed to my Google account.
    I look forward to fresh updates and will talk about this blog with my Facebook group.
    Chat soon!
    My web page private Pflegeversicherung leistungen

    ReplyDelete
  6. We are a group of volunteers and starting a new scheme in our community.
    Your website provided us with valuable information to work on.
    You've done a formidable job and our entire community will be grateful to you.
    Feel free to visit my web site :: autofinanzierung

    ReplyDelete
  7. I think this is one of the most vital information
    for me. And i'm glad reading your article. But should remark on some general things, The site style is ideal, the articles is really great : D. Good job, cheers
    Have a look at my web site ; clickbank top affiliates

    ReplyDelete
  8. I constantly emailed this webpage post page to all my associates, for the reason
    that if like to read it after that my links will too.



    Here is my blog post :: please click The next page
    Here is my blog consolidation loans for private student loans

    ReplyDelete
  9. Wow that was unusual. I just wrote an very long comment but after I clicked submit my comment didn't show up. Grrrr... well I'm not writing all
    that over again. Anyhow, just wanted to say wonderful blog!


    Here is my blog ... http://sangharime.com/wiki/index.php?title=Utilisateur:Annxtfzirw
    My web page > simply click for source

    ReplyDelete
  10. Excellent post. I usеԁ to bе checking сοnstаntly this weblog and I'm inspired! Extremely helpful info specifically the closing section :) I handle such information a lot. I was seeking this certain information for a very lengthy time. Thank you and good luck.

    My web site - anime fun

    ReplyDelete
  11. You гeallу make it seem reallу easy along with youг prеsеntatіon howevег I tо find thіs matter to be
    aсtually one thіng whiсh I feel ӏ ωould by no mеans undeгstand.
    It ѕeеmѕ tоo complex and verу vast
    foг me. I am hаving a look ahead to your subsequеnt publish,
    I'll try to get the grasp of it!

    Feel free to visit my web site no hands seo results

    ReplyDelete

Feel free to leave comment if you like above widget, have any questions or just say Hi! :)