Best and easiest image slider banner for homepage in MVC

[grafic.web]

Hi there,

i'm looking for the easiest image slider banner for my homepage, any suggest?

Thanks!!

[JorgeM]

I've always liked Nivo Slider. However, there are countless slides out there. You can also build a simple one on your own.

[grafic.web]

Something free?

[JorgeM]

that slider is free if its not for a wordpress site.

From there site...

The Nivo Slider jQuery plugin is open source and released under the MIT license. This means you can use it almost anywhere and for almost any kind of project, including personal and commercial websites and themes you make. It also means you can give back to the community by contributing your own improvements to the slider via GitHub.

However, don't just go by my one recommendation. I like it but you may find something else out there that may fit better for you. Many of these sliders are free to incorporate into your projects. If you have the time, I'd recommend you do a search find a few that look appealing to you and test them out. Since they are client side, they are very easy to integrate into your project on a test page.

[gabrielcastillo]

This is not my slider, but I've used in a few projects before.. work good for just a very simple image slider.

//html
<ul id="html-slider">
    <li><img src="" alt="" /></li>
    <li><img src="" alt="" /></li>
    <li><img src="" alt="" /></li>
</ul>
<div id="counter"></div>

//CSS
    #html-slider {
        height:200px;
        list-style:none;
        margin:;
        padding:0;
        overflow:hidden;
        position:relative;
    }

    #html-slider li {
        display:none;
        left:0;
        position:absolute;
        top:0;
    }

    #html-slider li:first-child {
        display:inline-block;
    }

//Jquery
(function($){
    $.fn.PageSlider = function(interval){
    var slides;
    var cnt;
    var amount;
    var i;

    function run(){
    $(slides[i]).fadeOut(1000);
    i++;
    if(i >= amount) i=0;
    $(slides[i]).fadeIn(1000);

    cnt.text(i+1+ '/' + amount);
    setTimeout(run, interval);
    }


    slides = $("#page-slider").children();
    cnt = $("#counter");
    amount = slides.length;
    i=0;

    cnt.text(i+1+ '/' + amount);
    setTimeout(run, interval);
    };
})(jQuery);

jQuery(window).load(function(){
$("#html-slider").PageSlider(3000);
});

[JorgeM]

Nice job on this slider. However, change line 49 to:

slides = $("#html-slider").children();

[gabrielcastillo]

@JorgeM nice catch.. Was in a hurry.

[iamthwee]

flexslider? Plus it is responsive.

[grafic.web]

Thanks for thi!!! AMZING