-
Notifications
You must be signed in to change notification settings - Fork 0
/
internal slider.php
110 lines (93 loc) · 3.72 KB
/
internal slider.php
1
<html><head><link rel="stylesheet" href="internalslider.css"></head><body><!--We will make a slider with stylized thumbnails using CSS3The markup is very simple:Radio InputsLabels with thumbnails to detect click eventMain Image--><center><div class="slider"> <input type="radio" name="slide_switch" id="id1"/> <label for="id1"> <img src="http://thecodeplayer.com/uploads/media/3yiC6Yq.jpg" width="200"/> </label> <img src="http://thecodeplayer.com/uploads/media/3yiC6Yq.jpg"/> <!--Lets show the second image by default on page load--> <input type="radio" name="slide_switch" id="id2" checked="checked"/> <label for="id2"> <img src="http://thecodeplayer.com/uploads/media/40Ly3VB.jpg" width="200"/> </label> <img src="http://thecodeplayer.com/uploads/media/40Ly3VB.jpg"/> <input type="radio" name="slide_switch" id="id3"/> <label for="id3"> <img src="http://thecodeplayer.com/uploads/media/00kih8g.jpg" width="200"/> </label> <img src="http://thecodeplayer.com/uploads/media/00kih8g.jpg"/> <input type="radio" name="slide_switch" id="id4"/> <label for="id4"> <img src="http://thecodeplayer.com/uploads/media/2rT2vdx.jpg" width="200"/> </label> <img src="http://thecodeplayer.com/uploads/media/2rT2vdx.jpg"/> <input type="radio" name="slide_switch" id="id5"/> <label for="id5"> <img src="http://thecodeplayer.com/uploads/media/8k3N3EL.jpg" width="200"/> </label> <img src="http://thecodeplayer.com/uploads/media/8k3N3EL.jpg"/> <input type="radio" name="slide_switch" id="id6"/> <label for="id6"> <img src="http://thecodeplayer.com/uploads/media/8k3N3EL.jpg" width="200"/> </label> <img src="http://thecodeplayer.com/uploads/media/8k3N3EL.jpg"/> <input type="radio" name="slide_switch" id="id7"/> <label for="id7"> <img src="http://thecodeplayer.com/uploads/media/8k3N3EL.jpg" width="200"/> </label> <img src="http://thecodeplayer.com/uploads/media/8k3N3EL.jpg"/> <input type="radio" name="slide_switch" id="id8"/> <label for="id8"> <img src="http://thecodeplayer.com/uploads/media/8k3N3EL.jpg" width="200"/> </label> <img src="http://thecodeplayer.com/uploads/media/8k3N3EL.jpg"/> <input type="radio" name="slide_switch" id="id9"/> <label for="id9"> <img src="http://thecodeplayer.com/uploads/media/8k3N3EL.jpg" width="200"/> </label> <img src="http://thecodeplayer.com/uploads/media/8k3N3EL.jpg"/> <input type="radio" name="slide_switch" id="id10"/> <label for="id10"> <img src="http://thecodeplayer.com/uploads/media/8k3N3EL.jpg" width="200"/> </label> <img src="http://thecodeplayer.com/uploads/media/8k3N3EL.jpg"/> <input type="radio" name="slide_switch" id="id11"/> <label for="id11"> <img src="http://thecodeplayer.com/uploads/media/8k3N3EL.jpg" width="200"/> </label> <img src="http://thecodeplayer.com/uploads/media/8k3N3EL.jpg"/> <input type="radio" name="slide_switch" id="id12"/> <label for="id12"> <img src="http://thecodeplayer.com/uploads/media/8k3N3EL.jpg" width="200"/> </label> <input type="radio" name="slide_switch" id="id13"/> <label for="id13"> <img src="http://thecodeplayer.com/uploads/media/8k3N3EL.jpg" width="200"/> </label> <img src="http://thecodeplayer.com/uploads/media/8k3N3EL.jpg"/> <input type="radio" name="slide_switch" id="id14"/> <label for="id13"> <img src="http://thecodeplayer.com/uploads/media/8k3N3EL.jpg" width="200"/> </label> <img src="http://thecodeplayer.com/uploads/media/8k3N3EL.jpg"/> <input type="radio" name="slide_switch" id="id14"/> <label for="id14"> <img src="http://thecodeplayer.com/uploads/media/8k3N3EL.jpg" width="200"/> </label> <img src="http://thecodeplayer.com/uploads/media/8k3N3EL.jpg"/></div></center><script src="http://thecodeplayer.com/uploads/js/prefixfree.js" type="text/javascript"></script></body></html>