top


Amel Nuhanovic
Nivo Slider - Thu Jan 19, 2012 1:36 am Author: Amel Nuhanovic

Here i got problem like this...i never learn how to make this, but i copy all from old forum where i think all that is CSS index_body HTML Management all that Gangstar15 make before at forum and he show me where to add pictures i know only that. Ok this i make at forum i think its really something little nothing big like how you can see at forum http://xtremegraphic.forumotion.com/ always loading... 2days already hahahahahaha

THANKS

Amel Nuhanovic
Re: Nivo Slider - Thu Jan 26, 2012 7:04 pm Author: Amel Nuhanovic

anyone about this???

Japorized
Re: Nivo Slider - Thu Jan 26, 2012 8:04 pm Author: Japorized

Copy the code of the slider here.

Amel Nuhanovic
Re: Nivo Slider - Thu Jan 26, 2012 9:15 pm Author: Amel Nuhanovic

problem is i lost all that Sad but i found link from forumotion there is all but idk how to make http://help.forumotion.com/t92614-news-slider?highlight=slider

Japorized
Re: Nivo Slider - Fri Jan 27, 2012 7:30 pm Author: Japorized

Nera already showed everyone the way (well, at least that's one of it).

Amel Nuhanovic
Re: Nivo Slider - Thu Feb 02, 2012 1:31 am Author: Amel Nuhanovic

Ok this is how nera showed that but this dont work look please...maybe something missing there

this is html page management

Code:
<html>
        <head>
            <title>Nivo Slider Demo</title>
            <link rel="stylesheet" href="http://nivo.dev7studios.com/scripts/nivo-slider/nivo-slider.css" type="text/css" media="screen" />
            <link rel="stylesheet" href="style.css" type="text/css" media="screen" />
        <style>
            background:url(http://i44.tinypic.com/346rh95.png) no-repeat;
            width:600px;
            height:392px;
            margin:0 auto;
            padding-top:74px;
            margin-top:-45px;
        }
        #slider {
            position:relative;
            width:618px;
            height:246px;
            margin-left:190px;
            background:url(http://i42.tinypic.com/20zv3ep.png) no-repeat 50% 50%;
        }
        #slider img {
            position:absolute;
            top:0px;
            left:0px;
            display:none;
        }
        #slider a {
            border:0;
            display:block;
        }
       
        .nivo-controlNav {
            position:absolute;
            left:260px;
            bottom:-42px;
        }
        .nivo-controlNav a {
            display:block;
            width:22px;
            height:22px;
            background:url(http://i22.servimg.com/u/f22/15/42/72/40/bullet10.png) no-repeat;
            text-indent:-9999px;
            border:0;
            margin-right:3px;
            float:left;
        }
        .nivo-controlNav a.active {
            background-position:0 -22px;
        }
       
        .nivo-directionNav a {
            display:block;
            width:30px;
            height:30px;
            background:url(http://i22.servimg.com/u/f22/16/52/61/30/arrows10.png) no-repeat;
            text-indent:-9999px;
            border:0;
        }
        a.nivo-nextNav {
            background-position:-30px 0;
            right:15px;
        }
        a.nivo-prevNav {
            left:15px;
        }
       
        .nivo-caption {
            text-shadow:none;
            font-family: Helvetica, Arial, sans-serif;
        width: 600px;
        }
        .nivo-caption a {
            color:#efe9d1;
            text-decoration:underline;
        }</style>
        </head>
        <body>
            <div id="wrapper">
       
                <div id="slider-wrapper">
             
                    <div id="slider" class="nivoSlider">
                        <img src="http://i40.tinypic.com/35l6kcw.gif" alt="" />
                        <a href="http://dev7studios.com"><img src="http://i43.tinypic.com/24cedf9.gif" alt="" title="This is an example of a caption" /></a>
                        <img src="http://i40.tinypic.com/vony4z.gif" alt="" />
                        <img src="http://i43.tinypic.com/ap9vn4.gif" alt="" title="#htmlcaption" />
                    </div>
                    <div id="htmlcaption" class="nivo-html-caption">
                        <strong>This</strong> is an example of a <em>HTML</em> caption with <a href="#">a link</a>.
                    </div>
             
                </div>
       
            </div>
            <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.6.1.min.js"></script>
            <script type="text/javascript" src="http://nivo.dev7studios.com/scripts/nivo-slider/jquery.nivo.slider.pack.js"></script>
            <script type="text/javascript">
        $(window).load(function() {
            $('#slider').nivoSlider();
        });
        </script>
        </body>
        </html>

and this i put on Homepage message
Code:
<center><iframe src="http://amelbasher.freegametalk.com/h1-nivo-slider" width="100%" height="300"></iframe></center>

Japorized
Re: Nivo Slider - Thu Feb 02, 2012 6:06 pm Author: Japorized

You have to change the below address to a new one

Code:
http://nivo.dev7studios.com/scripts/nivo-slider/jquery.nivo.slider.pack.js
It isn't there anymore.

Amel Nuhanovic
Re: Nivo Slider - Fri Feb 03, 2012 10:45 am Author: Amel Nuhanovic

sure but how??? what i need to do

Japorized
Re: Nivo Slider - Sun Feb 05, 2012 7:06 pm Author: Japorized

Put that javascript to your library (the one that Forumotion now provides), grab the link and replace the one above.

Amel Nuhanovic
Re: Nivo Slider - Wed Mar 07, 2012 5:14 am Author: Amel Nuhanovic

Ok finaly i make this at forum and looks great, but i want edit some things..

1. make little bigger slider
2. remove that text at slider YOU CAN ADD CAPTIONS TOO...
3. where to add background pictures for slider?

here is homepage message

Code:
 <div style="width:700px;margin:40px auto;"><div class="slider-wrapper theme-default"><div class="ribbon"></div><div id="nivoslider-125" class="nivoSlider" style="width:700px;height:300px;"><img src="http://nivo.dev7studios.com/wp-content/uploads/2011/08/nemo83-700x300.png" alt="" /><img src="http://nivo.dev7studios.com/wp-content/uploads/2011/08/slider65-700x300.png" title="#nivoslider-125-caption-0" alt="" /><img src="http://nivo.dev7studios.com/wp-content/uploads/2011/08/walle12-700x300.png" alt="" /></div>
        </div><div id="nivoslider-125-caption-0" class="nivo-html-caption">You can add captions too…</div>

        <p><script type="text/javascript">
        jQuery(window).load(function(){
            jQuery("#nivoslider-125").nivoSlider({
                effect:"random",
                slices:15,
                boxCols:8,
                boxRows:4,
                animSpeed:500,
                pauseTime:3000,
                startSlide:0,
                directionNav:true,
                directionNavHide:true,
                controlNav:true,
                controlNavThumbs:false,
                controlNavThumbsFromRel:true,
                keyboardNav:true,
                pauseOnHover:true,
                manualAdvance:false
            });
        });
        </script>
        </div>
here is css

Code:


        /*
        * jQuery Nivo Slider v2.7.1
        * http://nivo.dev7studios.com
        *
        * Copyright 2011, Gilbert Pellegrom
        * Free to use and abuse under the MIT license.
        * http://www.opensource.org/licenses/mit-license.php
        *
        * March 2010
        */
       
       
        /* The Nivo Slider styles */
        .nivoSlider {
          position:relative;
        }
        .nivoSlider img {
          position:absolute;
          top:0px;
          left:0px;
        }
        /* If an image is wrapped in a link */
        .nivoSlider a.nivo-imageLink {
          position:absolute;
          top:0px;
          left:0px;
          width:100%;
          height:100%;
          border:0;
          padding:0;
          margin:0;
          z-index:6;
          display:none;
        }
        /* The slices and boxes in the Slider */
        .nivo-slice {
          display:block;
          position:absolute;
          z-index:5;
          height:100%;
        }
        .nivo-box {
          display:block;
          position:absolute;
          z-index:5;
        }
        /* Caption styles */
        .nivo-caption {
          position:absolute;
          left:0px;
          bottom:0px;
          background:#000;
          color:#fff;
          opacity:0.8; /* Overridden by captionOpacity setting */
          width:100%;
          z-index:8;
        }
        .nivo-caption p {
          padding:5px;
          margin:0;
        }
        .nivo-caption a {
          display:inline !important;
        }
        .nivo-html-caption {
            display:none;
        }
        /* Direction nav styles (e.g. Next & Prev) */
        .nivo-directionNav a {
          position:absolute;
          top:45%;
          z-index:9;
          cursor:pointer;
        }
        .nivo-prevNav {
          left:0px;
        }
        .nivo-nextNav {
          right:0px;
        }
        /* Control nav styles (e.g. 1,2,3...) */
        .nivo-controlNav a {
          position:relative;
          z-index:9;
          cursor:pointer;
        }
        .nivo-controlNav a.active {
          font-weight:bold;
        }
        /*
        Skin Name: Nivo Slider Default Theme
        Skin URI: http://nivo.dev7studios.com
        Skin Type: flexible
        Description: The default skin for the Nivo Slider.
        Version: 1.0
        Author: Gilbert Pellegrom
        Author URI: http://dev7studios.com
        */
        .theme-default .nivoSlider {
          position:relative;
          background:#fff url(http://i46.servimg.com/u/f46/15/66/68/20/loadin10.gif) no-repeat 50% 50%;
            margin-bottom:50px;
            -webkit-box-shadow: 0px 1px 5px 0px #4a4a4a;
            -moz-box-shadow: 0px 1px 5px 0px #4a4a4a;
            box-shadow: 0px 1px 5px 0px #4a4a4a;
        }
        .theme-default .nivoSlider img {
          position:absolute;
          top:0px;
          left:0px;
          display:none;
        }
        .theme-default .nivoSlider a {
          border:0;
          display:block;
        }
        .theme-default .nivo-controlNav {
          position:absolute;
          left:50%;
          bottom:-42px;
            margin-left:-40px; /* Tweak this to center bullets */
        }
        .theme-default .nivo-controlNav a {
          display:block;
          width:22px;
          height:22px;
          background:url(http://i46.servimg.com/u/f46/15/66/68/20/bullet10.png) no-repeat;
          text-indent:-9999px;
          border:0;
          margin-right:3px;
          float:left;
        }
        .theme-default .nivo-controlNav a.active {
          background-position:0 -22px;
        }
        .theme-default .nivo-directionNav a {
          display:block;
          width:30px;
          height:30px;
          background:url(http://i46.servimg.com/u/f46/15/66/68/20/arrows10.png) no-repeat;
          text-indent:-9999px;
          border:0;
        }
        .theme-default a.nivo-nextNav {
          background-position:-30px 0;
          right:15px;
        }
        .theme-default a.nivo-prevNav {
          left:15px;
        }
        .theme-default .nivo-caption {
            font-family: Helvetica, Arial, sans-serif;
        }
        .theme-default .nivo-caption a {
            color:#fff;
            border-bottom:1px dotted #fff;
        }
        .theme-default .nivo-caption a:hover {
            color:#fff;
        }

and here is Javascript codes management

Code:
/*
        * jQuery Nivo Slider v2.7
        * http://nivo.dev7studios.com
        *
        * Copyright 2011, Gilbert Pellegrom
        * Free to use and abuse under the MIT license.
        * http://www.opensource.org/licenses/mit-license.php
        *
        * March 2010
        */

        (function(a){var b=function(b,c){var d=a.extend({},a.fn.nivoSlider.defaults,c);var e={currentSlide:0,currentImage:"",totalSlides:0,running:false,paused:false,stop:false};var f=a(b);f.data("nivo:vars",e);f.css("position","relative");f.addClass("nivoSlider");var g=f.children();g.each(function(){var b=a(this);var c="";if(!b.is("img")){if(b.is("a")){b.addClass("nivo-imageLink");c=b}b=b.find("img:first")}var d=b.width();if(d==0)d=b.attr("width");var g=b.height();if(g==0)g=b.attr("height");if(d>f.width()){f.width(d)}if(g>f.height()){f.height(g)}if(c!=""){c.css("display","none")}b.css("display","none");e.totalSlides++});if(d.randomStart){d.startSlide=Math.floor(Math.random()*e.totalSlides)}if(d.startSlide>0){if(d.startSlide>=e.totalSlides)d.startSlide=e.totalSlides-1;e.currentSlide=d.startSlide}if(a(g[e.currentSlide]).is("img")){e.currentImage=a(g[e.currentSlide])}else{e.currentImage=a(g[e.currentSlide]).find("img:first")}if(a(g[e.currentSlide]).is("a")){a(g[e.currentSlide]).css("display","block")}f.css("background",'url("'+e.currentImage.attr("src")+'") no-repeat');f.append(a('<div class="nivo-caption"><p></p></div>').css({display:"none",opacity:d.captionOpacity}));var h=function(b){var c=a(".nivo-caption",f);if(e.currentImage.attr("title")!=""&&e.currentImage.attr("title")!=undefined){var d=e.currentImage.attr("title");if(d.substr(0,1)=="#")d=a(d).html();if(c.css("display")=="block"){c.find("p").stop().fadeOut(b.animSpeed,function(){a(this).html(d);a(this).stop().fadeIn(b.animSpeed)})}else{c.find("p").html(d)}c.stop().fadeIn(b.animSpeed)}else{c.stop().fadeOut(b.animSpeed)}};h(d);var i=0;if(!d.manualAdvance&&g.length>1){i=setInterval(function(){o(f,g,d,false)},d.pauseTime)}if(d.directionNav){f.append('<div class="nivo-directionNav"><a class="nivo-prevNav">'+d.prevText+'</a><a class="nivo-nextNav">'+d.nextText+"</a></div>");if(d.directionNavHide){a(".nivo-directionNav",f).hide();f.hover(function(){a(".nivo-directionNav",f).show()},function(){a(".nivo-directionNav",f).hide()})}a("a.nivo-prevNav",f).live("click",function(){if(e.running)return false;clearInterval(i);i="";e.currentSlide-=2;o(f,g,d,"prev")});a("a.nivo-nextNav",f).live("click",function(){if(e.running)return false;clearInterval(i);i="";o(f,g,d,"next")})}if(d.controlNav){var j=a('<div class="nivo-controlNav"></div>');f.append(j);for(var k=0;k<g.length;k++){if(d.controlNavThumbs){var l=g.eq(k);if(!l.is("img")){l=l.find("img:first")}if(d.controlNavThumbsFromRel){j.append('<a class="nivo-control" rel="'+k+'"><img src="'+l.attr("rel")+'" alt="" /></a>')}else{j.append('<a class="nivo-control" rel="'+k+'"><img src="'+l.attr("src").replace(d.controlNavThumbsSearch,d.controlNavThumbsReplace)+'" alt="" /></a>')}}else{j.append('<a class="nivo-control" rel="'+k+'">'+(k+1)+"</a>")}}a(".nivo-controlNav a:eq("+e.currentSlide+")",f).addClass("active");a(".nivo-controlNav a",f).live("click",function(){if(e.running)return false;if(a(this).hasClass("active"))return false;clearInterval(i);i="";f.css("background",'url("'+e.currentImage.attr("src")+'") no-repeat');e.currentSlide=a(this).attr("rel")-1;o(f,g,d,"control")})}if(d.keyboardNav){a(window).keypress(function(a){if(a.keyCode=="37"){if(e.running)return false;clearInterval(i);i="";e.currentSlide-=2;o(f,g,d,"prev")}if(a.keyCode=="39"){if(e.running)return false;clearInterval(i);i="";o(f,g,d,"next")}})}if(d.pauseOnHover){f.hover(function(){e.paused=true;clearInterval(i);i=""},function(){e.paused=false;if(i==""&&!d.manualAdvance){i=setInterval(function(){o(f,g,d,false)},d.pauseTime)}})}f.bind("nivo:animFinished",function(){e.running=false;a(g).each(function(){if(a(this).is("a")){a(this).css("display","none")}});if(a(g[e.currentSlide]).is("a")){a(g[e.currentSlide]).css("display","block")}if(i==""&&!e.paused&&!d.manualAdvance){i=setInterval(function(){o(f,g,d,false)},d.pauseTime)}d.afterChange.call(this)});var m=function(b,c,d){for(var e=0;e<c.slices;e++){var f=Math.round(b.width()/c.slices);if(e==c.slices-1){b.append(a('<div class="nivo-slice"></div>').css({left:f*e+"px",width:b.width()-f*e+"px",height:"0px",opacity:"0",background:'url("'+d.currentImage.attr("src")+'") no-repeat -'+(f+e*f-f)+"px 0%"}))}else{b.append(a('<div class="nivo-slice"></div>').css({left:f*e+"px",width:f+"px",height:"0px",opacity:"0",background:'url("'+d.currentImage.attr("src")+'") no-repeat -'+(f+e*f-f)+"px 0%"}))}}};var n=function(b,c,d){var e=Math.round(b.width()/c.boxCols);var f=Math.round(b.height()/c.boxRows);for(var g=0;g<c.boxRows;g++){for(var h=0;h<c.boxCols;h++){if(h==c.boxCols-1){b.append(a('<div class="nivo-box"></div>').css({opacity:0,left:e*h+"px",top:f*g+"px",width:b.width()-e*h+"px",height:f+"px",background:'url("'+d.currentImage.attr("src")+'") no-repeat -'+(e+h*e-e)+"px -"+(f+g*f-f)+"px"}))}else{b.append(a('<div class="nivo-box"></div>').css({opacity:0,left:e*h+"px",top:f*g+"px",width:e+"px",height:f+"px",background:'url("'+d.currentImage.attr("src")+'") no-repeat -'+(e+h*e-e)+"px -"+(f+g*f-f)+"px"}))}}}};var o=function(b,c,d,e){var f=b.data("nivo:vars");if(f&&f.currentSlide==f.totalSlides-1){d.lastSlide.call(this)}if((!f||f.stop)&&!e)return false;d.beforeChange.call(this);if(!e){b.css("background",'url("'+f.currentImage.attr("src")+'") no-repeat')}else{if(e=="prev"){b.css("background",'url("'+f.currentImage.attr("src")+'") no-repeat')}if(e=="next"){b.css("background",'url("'+f.currentImage.attr("src")+'") no-repeat')}}f.currentSlide++;if(f.currentSlide==f.totalSlides){f.currentSlide=0;d.slideshowEnd.call(this)}if(f.currentSlide<0)f.currentSlide=f.totalSlides-1;if(a(c[f.currentSlide]).is("img")){f.currentImage=a(c[f.currentSlide])}else{f.currentImage=a(c[f.currentSlide]).find("img:first")}if(d.controlNav){a(".nivo-controlNav a",b).removeClass("active");a(".nivo-controlNav a:eq("+f.currentSlide+")",b).addClass("active")}h(d);a(".nivo-slice",b).remove();a(".nivo-box",b).remove();var g=d.effect;if(d.effect=="random"){var i=new Array("sliceDownRight","sliceDownLeft","sliceUpRight","sliceUpLeft","sliceUpDown","sliceUpDownLeft","fold","fade","boxRandom","boxRain","boxRainReverse","boxRainGrow","boxRainGrowReverse");g=i[Math.floor(Math.random()*(i.length+1))];if(g==undefined)g="fade"}if(d.effect.indexOf(",")!=-1){var i=d.effect.split(",");g=i[Math.floor(Math.random()*i.length)];if(g==undefined)g="fade"}if(f.currentImage.attr("data-transition")){g=f.currentImage.attr("data-transition")}f.running=true;if(g=="sliceDown"||g=="sliceDownRight"||g=="sliceDownLeft"){m(b,d,f);var j=0;var k=0;var l=a(".nivo-slice",b);if(g=="sliceDownLeft")l=a(".nivo-slice",b)._reverse();l.each(function(){var c=a(this);c.css({top:"0px"});if(k==d.slices-1){setTimeout(function(){c.animate({height:"100%",opacity:"1.0"},d.animSpeed,"",function(){b.trigger("nivo:animFinished")})},100+j)}else{setTimeout(function(){c.animate({height:"100%",opacity:"1.0"},d.animSpeed)},100+j)}j+=50;k++})}else if(g=="sliceUp"||g=="sliceUpRight"||g=="sliceUpLeft"){m(b,d,f);var j=0;var k=0;var l=a(".nivo-slice",b);if(g=="sliceUpLeft")l=a(".nivo-slice",b)._reverse();l.each(function(){var c=a(this);c.css({bottom:"0px"});if(k==d.slices-1){setTimeout(function(){c.animate({height:"100%",opacity:"1.0"},d.animSpeed,"",function(){b.trigger("nivo:animFinished")})},100+j)}else{setTimeout(function(){c.animate({height:"100%",opacity:"1.0"},d.animSpeed)},100+j)}j+=50;k++})}else if(g=="sliceUpDown"||g=="sliceUpDownRight"||g=="sliceUpDownLeft"){m(b,d,f);var j=0;var k=0;var o=0;var l=a(".nivo-slice",b);if(g=="sliceUpDownLeft")l=a(".nivo-slice",b)._reverse();l.each(function(){var c=a(this);if(k==0){c.css("top","0px");k++}else{c.css("bottom","0px");k=0}if(o==d.slices-1){setTimeout(function(){c.animate({height:"100%",opacity:"1.0"},d.animSpeed,"",function(){b.trigger("nivo:animFinished")})},100+j)}else{setTimeout(function(){c.animate({height:"100%",opacity:"1.0"},d.animSpeed)},100+j)}j+=50;o++})}else if(g=="fold"){m(b,d,f);var j=0;var k=0;a(".nivo-slice",b).each(function(){var c=a(this);var e=c.width();c.css({top:"0px",height:"100%",width:"0px"});if(k==d.slices-1){setTimeout(function(){c.animate({width:e,opacity:"1.0"},d.animSpeed,"",function(){b.trigger("nivo:animFinished")})},100+j)}else{setTimeout(function(){c.animate({width:e,opacity:"1.0"},d.animSpeed)},100+j)}j+=50;k++})}else if(g=="fade"){m(b,d,f);var q=a(".nivo-slice:first",b);q.css({height:"100%",width:b.width()+"px"});q.animate({opacity:"1.0"},d.animSpeed*2,"",function(){b.trigger("nivo:animFinished")})}else if(g=="slideInRight"){m(b,d,f);var q=a(".nivo-slice:first",b);q.css({height:"100%",width:"0px",opacity:"1"});q.animate({width:b.width()+"px"},d.animSpeed*2,"",function(){b.trigger("nivo:animFinished")})}else if(g=="slideInLeft"){m(b,d,f);var q=a(".nivo-slice:first",b);q.css({height:"100%",width:"0px",opacity:"1",left:"",right:"0px"});q.animate({width:b.width()+"px"},d.animSpeed*2,"",function(){q.css({left:"0px",right:""});b.trigger("nivo:animFinished")})}else if(g=="boxRandom"){n(b,d,f);var r=d.boxCols*d.boxRows;var k=0;var j=0;var s=p(a(".nivo-box",b));s.each(function(){var c=a(this);if(k==r-1){setTimeout(function(){c.animate({opacity:"1"},d.animSpeed,"",function(){b.trigger("nivo:animFinished")})},100+j)}else{setTimeout(function(){c.animate({opacity:"1"},d.animSpeed)},100+j)}j+=20;k++})}else if(g=="boxRain"||g=="boxRainReverse"||g=="boxRainGrow"||g=="boxRainGrowReverse"){n(b,d,f);var r=d.boxCols*d.boxRows;var k=0;var j=0;var t=0;var u=0;var v=new Array;v[t]=new Array;var s=a(".nivo-box",b);if(g=="boxRainReverse"||g=="boxRainGrowReverse"){s=a(".nivo-box",b)._reverse()}s.each(function(){v[t][u]=a(this);u++;if(u==d.boxCols){t++;u=0;v[t]=new Array}});for(var w=0;w<d.boxCols*2;w++){var x=w;for(var y=0;y<d.boxRows;y++){if(x>=0&&x<d.boxCols){(function(c,e,f,h,i){var j=a(v[c][e]);var k=j.width();var l=j.height();if(g=="boxRainGrow"||g=="boxRainGrowReverse"){j.width(0).height(0)}if(h==i-1){setTimeout(function(){j.animate({opacity:"1",width:k,height:l},d.animSpeed/1.3,"",function(){b.trigger("nivo:animFinished")})},100+f)}else{setTimeout(function(){j.animate({opacity:"1",width:k,height:l},d.animSpeed/1.3)},100+f)}})(y,x,j,k,r);k++}x--}j+=100}}};var p=function(a){for(var b,c,d=a.length;d;b=parseInt(Math.random()*d),c=a[--d],a[d]=a[b],a[b]=c);return a};var q=function(a){if(this.console&&typeof console.log!="undefined")console.log(a)};this.stop=function(){if(!a(b).data("nivo:vars").stop){a(b).data("nivo:vars").stop=true;q("Stop Slider")}};this.start=function(){if(a(b).data("nivo:vars").stop){a(b).data("nivo:vars").stop=false;q("Start Slider")}};d.afterLoad.call(this);return this};a.fn.nivoSlider=function(c){return this.each(function(d,e){var f=a(this);if(f.data("nivoslider"))return f.data("nivoslider");var g=new b(this,c);f.data("nivoslider",g)})};a.fn.nivoSlider.defaults={effect:"random",slices:15,boxCols:8,boxRows:4,animSpeed:500,pauseTime:3e3,startSlide:0,directionNav:true,directionNavHide:true,controlNav:true,controlNavThumbs:false,controlNavThumbsFromRel:false,controlNavThumbsSearch:".jpg",controlNavThumbsReplace:"_thumb.jpg",keyboardNav:true,pauseOnHover:true,manualAdvance:false,captionOpacity:.8,prevText:"Prev",nextText:"Next",randomStart:false,beforeChange:function(){},afterChange:function(){},slideshowEnd:function(){},lastSlide:function(){},afterLoad:function(){}};a.fn._reverse=[].reverse})(jQuery)

Japorized
Re: Nivo Slider - Wed Mar 07, 2012 5:52 pm Author: Japorized

1. In the first line of your HTML code, change the width and height with a larger pixel.

2. To replace the caption, search for the class "nivo-html-caption" in your HTML. The text between that tag is your caption and you can do anything you want to it at will.

3. Look for slider-wrapper in your CSS and add your background to it with

Code:
background-image: url("IMAGE_URL_HERE");

Amel Nuhanovic
RE - Wed Mar 28, 2012 2:34 pm Author: Amel Nuhanovic

Ok all work fine but i got some white background at slider http://amelbasher.freegametalk.com/ what i dont know how to remove. How you can see same size like how is that white background i wanna make slider size. you say (1. In the first line of your HTML code, change the width and height with a larger pixel) that is here at homepage message in start

Code:
<div style="width:700px;margin:40px auto;">
ok i change but i got bigger then now that white background and size of slider stay same...please help

THANKS

Japorized
Re: Nivo Slider - Wed Mar 28, 2012 8:07 pm Author: Japorized

Go to pun-announcement and change the background colour to transparent

Re: Nivo Slider - Author: Sponsored content