HHEEELP!!
here is my slider for my PORTFOLIO site(not ready)i have a problens with slider Watch slider some seconds and you will understand what i'm talking about CODE: <!DOCTYPE html> <head></head> <body onload="slide_one();"> <img src="https://i1.sndcdn.com/artworks-000006178558-g8ykfa-t500x500.jpg" class="img" id="img_1"> <img src="https://im0-tub-com.yandex.net/i?id=67eee28a1b2d39656746d69fcbca8d32&n=13" class="img" id="img_2"> <img src="https://i1.sndcdn.com/avatars-000314268544-drq581-t500x500.jpg" class="img" id="img_3"> <div class="buttonContent"> <input type="radio" name="slide" onclick="slide_one();"> <input type="radio" name="slide" onclick="slide_two();"> <input type="radio" name="slide" onclick="slide_tre();"> </div> <style type="text/css"> .img{ width: 500px; height: 500px; } .buttonSlider{ padding: 5px; background-color: red; width: 15px; height: 15px; margin: 3px; float: left; cursor: pointer; } /*default*/ #img_1{ display: block; } #img_2{ display: none } #img_3{ display: none; } </style> <script type="text/javascript"> function slide_one() { document.getElementById('img_1').style.display='block'; document.getElementById('img_2').style.display='none'; document.getElementById('img_3').style.display='none'; setInterval("slide_two();",3000); } function slide_two() { document.getElementById('img_1').style.display='none'; document.getElementById('img_2').style.display='block'; document.getElementById('img_3').style.display='none'; setInterval("slide_tre();",3000); } function slide_tre() { document.getElementById('img_1').style.display='none'; document.getElementById('img_2').style.display='none'; document.getElementById('img_3').style.display='block'; setInterval("slide_one();",3000); } </script> </body>
Often have questions like this?
Learn more efficiently, for free:
