Javascript Jquery slideshow -


what code in jquery let in slideshow make first photo appear after clicking next when on last photo. know need write once document ready didnt yet will. here code

<html>     <head>         <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>         <script src="slides.min.jquery.js"></script>         <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.js"></script>         <script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>         <script>             $(document).ready(function() {                 $("#links").mouseover(function() {                     $("#links").animate({                         'opacity': '1'                     });                 });             });             $(document).ready(function() {                 $("#links").mouseout(function() {                     $("#links").animate({                         'opacity': '0'                     });                 });             });             $(document).ready(function() {                 $("#rechts").mouseover(function() {                     $("#rechts").animate({                         'opacity': '1'                     });                 });             });             $(document).ready(function() {                 $("#rechts").mouseout(function() {                     $("#rechts").animate({                         'opacity': '0'                     });                 });             });             $(document).ready(function() {                 $("#links").click(function() {                     $("#slider").animate({                         left: '+=600px'                     }, 1000);                 });             });             $(document).ready(function() {                 $("#rechts").click(function() {                     $("#slider").animate({                         left: '-=600px'                     }, 1000)                 });             });         </script>         <meta charset="utf-8">         <title>slideshow</title>         <style type="text/css">             #holder {                 height: 400px;                 width: 600px;                 margin-right: auto;                 margin-left: auto;                 overflow: hidden;                 position: relative;             }             #slider {                 height: 400px;                 width: 2500px;                 position: relative;                 z-index: 1;                 float: left;             }             #slider img {                 margin:0px;             }             #holder #rechts {                 height: 100px;                 width: 50px;                 position: absolute;                 z-index: 10;                 left: 550px;                 top: 0px;                 opacity: 0;                 padding-top: 150px;                 cursor:pointer;             }             #holder #links {                 height: 100px;                 width: 50px;                 padding-top: 150px;                 position: absolute;                 z-index: 10;                 left: 0px;                 cursor:pointer;                 opacity:0             }         </style>     </head>      <body>          <h1><center>dit mijn opdracht van dieter(slideshow)</center></h1>          <div id="holder">             <div id="slider">                 <img src="images/auto1.jpg" width="600" height="400">                 <img src="images/auto2.jpg" width="600" height="400">                 <img src="images/auto3.jpg" width="600" height="400">                 <img src="images/auto4.jpg" height="400" width="600" />             </div>             <div id="rechts">                 <img src="images/pijlrechts.png" width="50" height="100" />             </div>             <div id="links">                 <img src="images/pijllinks.png" width="50" height="100" />             </div>         </div>         </div>     </body> </html> 

you should check whether element has sibling towards 1 side, can done $('element').nextall().length > 0 or $('element').prevall().length > 0veel succes :) looking for?

http://plnkr.co/edit/t6k4tlz4pbt0pdol5ozj?p=preview


Comments

Popular posts from this blog

angularjs - ADAL JS Angular- WebAPI add a new role claim to the token -

php - CakePHP HttpSockets send array of paramms -

node.js - Using Node without global install -