Line 17: | Line 17: | ||
} | } | ||
− | /* | + | /*Time for the CSS*/ |
* {margin: 0; padding: 0;} | * {margin: 0; padding: 0;} | ||
body {background: #ccc;} | body {background: #ccc;} | ||
Line 30: | Line 30: | ||
/*Lets add a shadow*/ | /*Lets add a shadow*/ | ||
+ | box-shadow: 0 10px 20px -5px rgba(0, 0, 0, 0.75); | ||
} | } | ||
Line 46: | Line 47: | ||
.slider label { | .slider label { | ||
/*Lets add some spacing for the thumbnails*/ | /*Lets add some spacing for the thumbnails*/ | ||
− | margin: 18px 0 0 18px; | + | margin: 18px 0 0 18px; |
− | + | ||
− | + | ||
float: left; | float: left; | ||
cursor: pointer; | cursor: pointer; | ||
Line 224: | Line 223: | ||
--> | --> | ||
<div class="slider"> | <div class="slider"> | ||
− | <input type="radio" name="slide_switch" id="id1 | + | <input type="radio" name="slide_switch" id="id1"/> |
<label for="id1"> | <label for="id1"> | ||
− | <img src=" | + | <img src="http://thecodeplayer.com/uploads/media/3yiC6Yq.jpg" width="100"/> |
</label> | </label> | ||
− | <img src=" | + | <img src="http://thecodeplayer.com/uploads/media/3yiC6Yq.jpg"/> |
<!--Lets show the second image by default on page load--> | <!--Lets show the second image by default on page load--> | ||
− | <input type="radio" name="slide_switch" id="id2"/> | + | <input type="radio" name="slide_switch" id="id2" checked="checked"/> |
<label for="id2"> | <label for="id2"> | ||
<img src="http://thecodeplayer.com/uploads/media/40Ly3VB.jpg" width="100"/> | <img src="http://thecodeplayer.com/uploads/media/40Ly3VB.jpg" width="100"/> |
Revision as of 22:06, 14 December 2017