Permalink
Switch branches/tags
Nothing to show
Find file
Fetching contributors…
Cannot retrieve contributors at this time
54 lines (51 sloc) 2.18 KB
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Image Swipe</title>
<style type="text/css" media="screen">
.IS_control{
background:#EEE -webkit-gradient(linear, 0 0, 0 65%, from(#B8B8B8), to(#EEE)) no-repeat;
border-radius:5px;
}
.IS_control .IS_button{
-webkit-box-shadow: #777 0px 2px 3px;
-moz-box-shadow: #777 0px 2px 3px;
-ms-box-shadow: #777 0px 2px 3px;
-o-box-shadow: #777 0px 2px 3px;
box-shadow: #777 0px 2px 3px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
-o-box-sizing: border-box;
box-sizing: border-box;
border-radius:20px;
background: #EEE; /* Old browsers */
background: -moz-linear-gradient(top, #bfbfbf 0%, #eeeeee 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#bfbfbf), color-stop(100%,#eeeeee)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #bfbfbf 0%,#eeeeee 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #bfbfbf 0%,#eeeeee 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #bfbfbf 0%,#eeeeee 100%); /* IE10+ */
background: linear-gradient(top, #bfbfbf 0%,#eeeeee 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bfbfbf', endColorstr='#eeeeee',GradientType=0 ); /* IE6-9 */
}
</style>
</head>
<body>
<div id="theImageSwipe"></div>
<script type="text/javascript" src="js/min/jquery-1.5.1.min.js" charset="utf-8"></script>
<script type="text/javascript" src="js/min/jquery-ui-1.8.11.custom.min.js" charset="utf-8"></script>
<script type="text/javascript" src="js/min/jquery.ui.touch.min.js" charset="utf-8"></script>
<script type="text/javascript" src="js/min/jquery.ui.ipad.altfix.min.js" charset="utf-8"></script>
<script type="text/javascript" src="js/min/imageswipe.min.js" charset="utf-8"></script>
<script type="text/javascript">
swipeThis(
'theImageSwipe', // div #id that will render
970, // width of the images
500, // height of the images
'images/antes.jpg', // the image of 'before'
'images/depois.jpg' // the image of 'after'
);
</script>
</body>
</html>