vinsux Posted July 22, 2012 Share Posted July 22, 2012 Can i ask a little help.? i have a nivoslider but the screen image doesn't slide.. it shows only 1 image.. PLEASE I NEED HELP..!! Here's my HTML Code <div id="slider"> <section id="slider-wrapper"> <div id="slider" class="nivoSlider"> <img style="display: none;" src="images/splash2.jpg" alt="" title="#htmlcaption-1"> <img style="display: none;" src="images/promo2.jpg" alt="" title="#htmlcaption-2"> <img style="display: none;" src="images/promo3.jpg" alt="" title="#htmlcaption-3"> </div> <div id="htmlcaption-1" class="nivo-html-caption"> <h5 class="p2">Welcome to Our site</h5> <p>Para?aque Branch</p> </div> <div id="htmlcaption-2" class="nivo-html-caption"> <h5 class="p3">In this Site</h5> <p>You can download or upload your lecture's soft copy</p> </div> <div id="htmlcaption-3" class="nivo-html-caption"> <h5 class="p4">Accesible for student and faculty</h5> <p>Welcome to Online Course Materials</p> </div> <div id="htmlcaption-3" class="nivo-html-caption"> <h5 class="p2">Or something else</h5> <p>Put any description here</p> </div> </section> </div> MY CSS #slider-wrapper { } .nivoSlider { position:relative; } .nivoSlider img { position:absolute; top:0px; left:0px; } .nivo-slice { display:block; position:absolute; z-index:50; height:100%; } .nivo-box { display:block; position:absolute; z-index:5; } .nivo-caption { background-color:rgba(255, 255, 255, 0.7); width:808px; padding:22px 170px 28px 22px; color:#000; position:absolute; left:0; bottom:0; z-index:90; } .nivo-caption h5 { font-size:30px; font-weight:normal; line-height:1.2em; margin:0; padding:0 0 2px; } .nivo-caption p { padding:0; line-height:16px; font-size:12px; } .nivo-html-caption { display:none; } Quote Link to comment https://forums.phpfreaks.com/topic/266076-nivo-slider-not-sliding/ Share on other sites More sharing options...
jazzman1 Posted July 22, 2012 Share Posted July 22, 2012 Did you link the query.nivo.slider.pack script file ? I can not see nothing of that Quote Link to comment https://forums.phpfreaks.com/topic/266076-nivo-slider-not-sliding/#findComment-1363449 Share on other sites More sharing options...
vinsux Posted July 22, 2012 Author Share Posted July 22, 2012 yes.. i put on the upper page sry.. <link rel="stylesheet" href="css/nivo-slider.css" type="text/css" media="screen"> like this.. Quote Link to comment https://forums.phpfreaks.com/topic/266076-nivo-slider-not-sliding/#findComment-1363453 Share on other sites More sharing options...
vinsux Posted July 22, 2012 Author Share Posted July 22, 2012 here's the code in the upper page until middle part... <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <title>Online Course Materials</title> <link rel="stylesheet" href="css/menu.css" type="text/css" media="screen"> <link rel="stylesheet" href="css/reset.css" type="text/css" media="screen"> <link rel="stylesheet" href="css/style.css" type="text/css" media="screen"> <link rel="stylesheet" href="css/nivo-slider.css" type="text/css" media="screen"> <link rel="stylesheet" href="css/demo.css" type="text/css" media="screen"> <link rel='stylesheet' href='fcss.css' type='text/css'> <script src="js/jquery.js"></script> <script src="js/jquery.nivo.slider.pack.js"></script> <script src="js/main.js"></script> <script src="js/script.js"></script> <script src="js/side.js"></script> <!--[if lt IE 9]> <script type="text/javascript" src="js/html5.js"></script> <![endif]--> </head> <body> <div class="container"> <header> <nav> <div id="menu-container"> <ul id="navigationMenu"> <li><a href="faculty.php" class="normalMenu">Home</a></li> <li><a href="about.php" class="normalMenu">About</a></li> <li><a href="curriculum.php" class="normalMenu">Curriculum</a></li> <li><a href="feedback.php" class="normalMenu">Feedback</a></li> <li><a href="register.php" class="normalMenu">Register</a></li> </div> </ul> </nav> <div class="top_head"><span class="logo"><a href="www.amaes.edu.ph"><img src="images/ocm.jpg"title="E-Store template" alt="E-Store template" /></a></span><!-- Defining the top head element --> <div class="logo"><!-- Defining the logo element --></div> </div> </header> <div id="slider"> <section id="slider-wrapper"> <div id="slider" class="nivoSlider"> <img style="display: none;" src="images/splash2.jpg" alt="" title="#htmlcaption-1"> <img style="display: none;" src="images/promo2.jpg" alt="" title="#htmlcaption-2"> <img style="display: none;" src="images/promo3.jpg" alt="" title="#htmlcaption-3"> </div> <div id="htmlcaption-1" class="nivo-html-caption"> <h5 class="p2">Welcome to Our Site</h5> <p>Para?aque Branch</p> </div> <div id="htmlcaption-2" class="nivo-html-caption"> <h5 class="p3">In this Site</h5> <p>You can download or upload your lecture's soft copy</p> </div> <div id="htmlcaption-3" class="nivo-html-caption"> <h5 class="p4">Accesible for student and faculty</h5> <p>Welcome to Online Course Materials</p> </div> <div id="htmlcaption-3" class="nivo-html-caption"> <h5 class="p2">Or something else</h5> <p>Put any description here</p> </div> </section> </div> Quote Link to comment https://forums.phpfreaks.com/topic/266076-nivo-slider-not-sliding/#findComment-1363454 Share on other sites More sharing options...
Mahngiel Posted July 22, 2012 Share Posted July 22, 2012 you have to actually start it. $('#target_div').nivoSlider(); or $('#target-div').nivoSlider({ option: property }); Quote Link to comment https://forums.phpfreaks.com/topic/266076-nivo-slider-not-sliding/#findComment-1363455 Share on other sites More sharing options...
jazzman1 Posted July 22, 2012 Share Posted July 22, 2012 No, this is link to css nivo slider file, you need to include js script files to your header. Take a look at my project and check out the html source code -> http://kaneffbrookside.ca/stdimitar/ Quote Link to comment https://forums.phpfreaks.com/topic/266076-nivo-slider-not-sliding/#findComment-1363456 Share on other sites More sharing options...
vinsux Posted July 22, 2012 Author Share Posted July 22, 2012 i figured out that the js is the one who make the slider works.. but still it's not sliding.. Y_Y oohh welll... i'm really sry for the inconvenience again, i'm just newbie in programming.... my main.js $(window).load(function() { $('#slider').nivoSlider({ effect:'random', slices:15, boxCols:8, boxRows:8, animSpeed:500, pauseTime:4000, directionNav:false, directionNavHide:false, controlNav:false, captionOpacity:1 }); }); Quote Link to comment https://forums.phpfreaks.com/topic/266076-nivo-slider-not-sliding/#findComment-1363459 Share on other sites More sharing options...
jazzman1 Posted July 22, 2012 Share Posted July 22, 2012 do you have a public link to this? Quote Link to comment https://forums.phpfreaks.com/topic/266076-nivo-slider-not-sliding/#findComment-1363461 Share on other sites More sharing options...
vinsux Posted July 22, 2012 Author Share Posted July 22, 2012 what's public link? i got the nivo slider in this tutorial site.. http://www.script-tutorials.com/creating-new-html5css3-single-page-layout-e-store/ thank you jazz and mahngiel Quote Link to comment https://forums.phpfreaks.com/topic/266076-nivo-slider-not-sliding/#findComment-1363467 Share on other sites More sharing options...
jazzman1 Posted July 22, 2012 Share Posted July 22, 2012 Where is deployed the project, on local machine or to server too ? Quote Link to comment https://forums.phpfreaks.com/topic/266076-nivo-slider-not-sliding/#findComment-1363471 Share on other sites More sharing options...
cmgweb Posted July 23, 2012 Share Posted July 23, 2012 YangNovember 14, 2011 10:44 am Nivo Slider does not work in you demo, I have checked their website, their demo is , however, in you demo, you have two divs with id of ?slider?. I tried to change outer div with another id, then the nivo slider works! adminNovember 21, 2011 7:43 am Thanks Yang, Yes, it seems that I miss it. I changed first instance <div id="slider"> to <div id="slider2"> and now slider works well this is 2 comments on that demo page itself. try this see if it works. Quote Link to comment https://forums.phpfreaks.com/topic/266076-nivo-slider-not-sliding/#findComment-1363763 Share on other sites More sharing options...
vinsux Posted July 28, 2012 Author Share Posted July 28, 2012 ^ ^ i saw that one before.. but the author already fix that.. i'm really sorry, i'm pissed in my slider.. so i leave it not sliding.. i have a lot of things to do in my website.. but i really appreciate your help on newbie like me.. thank you very much for your help.. One day if i'm become a genius in programming.. i'll help newbies too...!! and that's my goal after i learn these things!!! Quote Link to comment https://forums.phpfreaks.com/topic/266076-nivo-slider-not-sliding/#findComment-1365051 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.