Background JQuery plugin with or without slideshow V1.2

Hello everyone,

I’ve made some changes to my Background JQuery plugin.

Here are the changes:

  • Overlay image creation – to create a small effect on the background image.
  • Uses now JQuery UI – you can get it here
  • And some code improvement


                       

And this is how it works

Simple usage with overlay:

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script src="jquery-1.7.2.min.js" type="text/javascript"></script>
    <script src="background.js" type="text/javascript"></script>
</head>
<body>
    <script type="text/javascript">
        overSet("repeater.png");
        bgSet(["background.png"],false);
    </script>
</body>

Background with slideshow:

<body>
    <script type="text/javascript">
         bgSet(["background0.png","background1.png"],true);
    </script>
</body>

Setting the timers (Image timer and Transaction timer):

<body>
    <script type="text/javascript">
        setTimer(5000);
        setTrans(2000);
        bgSet(["background0.png","background1.png"],true);
    </script>
</body>

Using a <DIV> to show some text corresponding to the current background image:

Also, in this case, the “text-align:” you define in the style with determinate from where the slide starts, like left or right.

<body>
    <script type="text/javascript"> bgSet(["background0.png","background1.png"],true); </script>
    <div id="image0" style="color: white;text-align: right; position: absolute; right: 200px;top: 30px;">
        <span class="span1">Some cool title Text</span><br/>
        <span class="span2">Another Text</span>
    </div>
</body>

If you have any question or doubt, leave a comment :).

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s