vBulletin CMS Widgets - Slider Widget s3slider

Here is a lite slider for vbulletin CMS
Login into Admin Panel(Admincp)
Open up vBulletin CMS in Sidebar click Widgets when page opens click Create New Widget near bottom page
Then a new page will come up and choose the following options:

Widget Type: Static HTML
Title: Slider
Description: Content Slider

click save
now you will see a widget called slider click configure and paste the following into the Enter Static HTML Box Edit the pictures you want and then Click save and you done.
Edit your Layout to show the widget where you want i would choose the Middle box in Home Layout

<style type="text/css">
ul#slider {
    width: 430px;
    height: 270px;
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

ul#slider li {
    float: left;
    position: relative;
    /*display: none;*/
}

ul#slider li div {
    position: absolute;
    width: 373px;
    background-color: #000;
    color: #fff;
    left: 0;
    /*display: none;*/
    padding: 10px;
}

.top {
    top: 0;
}

.bottom {
    bottom: 0;
}
</style>
<script src="js/jquery.js" type="text/javascript"></script>
<script src="js/mySlider.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $("#slider").mySlider({
            timeOut: 4000,
            captionOpacity: .7            
        });
    });
</script>
    <ul id="slider">

        <li>
            <img src="images/slider/2.jpg" alt="" />
            <div class="top">
                Some nice text captions..
            </div>
        </li>
        <li>
            <img src="images/slider/3.jpg" alt="" />
            <div class="bottom">

                Some nice text captions..
            </div>
        </li>
        <li>

            <img src="images/slider/4.jpg" alt="" />
            <div class="bottom">
                Some nice text captions..
            </div>
        </li>
    </ul>

Developer of the slider is Creative Commons Attribution

[CrazyProgrammer]

Reserved

[goyo]

Not here to "diss" your hard work but why would anyone want to load an extra 100kbyte javascript framework (jquery) to an already slow cms page when vB already using the yui framework.

Why not integrate one of the Yui slideshows like this one ?

(Also in theory css should load in head and javascript in the bottom of the rendered page.)

[Forum Lover]

No demo?

[Sleaklight]

Thank you, looks good.

[Jamie G]

Originally Posted by goyo

Not here to "diss" your hard work but why would anyone want to load an extra 100kbyte javascript framework (jquery) to an already slow cms page when vB already using the yui framework.

Why not integrate one of the Yui slideshows like this one ?

(Also in theory css should load in head and javascript in the bottom of the rendered page.)

If you can develop such a system to go on top of some forums then install it, I'd give ?? for it!

Cheers

[AzzidReign]

Perfect for those news posts we have

[tafreeh]

yea its really good for news and announcement ... Thanks

[Preech]

I see the difference now after completely reading the thread. This won't pull the images from a thread like the other one. I'm good fam. I don't have enough time to change them. Thank you.

[basilrath]

Theres a nifty software that creates the effect im using ..........diplayed here on my cms

http://www.tabletennistalk.co.uk/forum/content.php

the only downside up to now until i sort the threads it pulls from is it has to be done manually but the effect is fine