Permalink
Browse files

organizing the files and all minified

  • Loading branch information...
1 parent ed3908e commit ab6fb931e6017deb1715630b08001643b98d364e Daniel Filho committed Apr 17, 2011
File renamed without changes
File renamed without changes
View
@@ -20,98 +20,19 @@
<body>
<div id="theImageSwipe"></div>
- <script type="text/javascript" src="jquery-1.5.1.min.js" charset="utf-8"></script>
- <script type="text/javascript" src="jquery-ui-1.8.11.custom.min.js" charset="utf-8"></script>
- <script type="text/javascript" src="jquery.ui.touch.js" charset="utf-8"></script>
- <script type="text/javascript" src="jquery.ui.ipad.altfix.js" charset="utf-8"></script>
- <script type="text/javascript" charset="utf-8">
- $(document).ready(function(){
-
- swipeThis('theImageSwipe', 970, 500, 'antes.jpg', 'depois.jpg');
-
- function swipeThis(e, w, h, i1, i2){
- var wrapper = document.getElementById(e);
- wrapper.style.position = 'relative';
- wrapper.style.display = 'block';
- wrapper.style.width = w + 'px';
- wrapper.style.height = h + 'px';
-
- var theWrapper = document.createElement('div');
- theWrapper.id = 'theRealWrapper';
- theWrapper.style.position = 'relative';
- theWrapper.style.display = 'block';
- theWrapper.style.width = w + 'px';
- theWrapper.style.height = h + 'px';
- $(wrapper).append(theWrapper);
-
- var image1 = new Image();
- image1.src = i1;
-
- var image2 = new Image();
- image2.src = i2;
-
- var span1 = document.createElement('span');
- span1.id = 'IS_imageOne';
- span1.style.position = 'absolute';
- span1.style.width = w + 'px';
- span1.style.height = h + 'px';
- span1.style.top = '0';
- span1.style.left = '0';
- span1.style.overflow = 'hidden';
- span1.style.zIndex = '1';
- $(theWrapper).append(span1);
- $('#IS_imageOne').append(image1);
-
- var span2 = document.createElement('span');
- span2.id = 'IS_imageTwo';
- span2.style.position = 'absolute';
- span2.style.borderRight = '2px solid #FFF';
- span2.style.width = w/2 + 'px';
- span2.style.height = h + 'px';
- span2.style.top = '0';
- span2.style.left = '0';
- span2.style.overflow = 'hidden';
- span2.style.zIndex = '2';
- $(theWrapper).append(span2);
- $('#IS_imageTwo').append(image2);
-
- var control = document.createElement('div');
- control.className = 'IS_control';
- control.style.position = 'relative';
- control.style.width = w + 'px';
- control.style.height = '10px';
- control.style.margin = '10px 0';
- control.style.border = '1px solid #CCC';
-
- var button = document.createElement('div');
- button.className = 'IS_button';
- button.style.position = 'absolute';
- button.style.left = w/2-10 + 'px'; // w/2 pra dar metade, -10px por ser metade do width do elemento (20px)
- button.style.zIndex = '3';
- button.style.width = '20px';
- button.style.height = '20px';
- button.style.marginTop = '-6px';
-
- $(wrapper).append(control);
- $('.IS_control').append(button);
-
- // drag & drop
- $('.IS_button').draggable({
- axis: 'x',
- containment: [0, 0, w, 0],
- handle: '.IS_control'
- }).addTouch();
-
- $('.IS_button').draggable({
- drag: function(){
- var buttonPosition = $(this).position();
- $('#IS_imageTwo').css('width', buttonPosition.left+10);
- }
- });
-
- }
-
- });
+ <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>
+</html>
View
@@ -0,0 +1,80 @@
+function swipeThis(e, w, h, i1, i2){
+ var wrapper = document.getElementById(e);
+ wrapper.style.position = 'relative';
+ wrapper.style.display = 'block';
+ wrapper.style.width = w + 'px';
+ wrapper.style.height = h + 'px';
+
+ var theWrapper = document.createElement('div');
+ theWrapper.id = 'theRealWrapper';
+ theWrapper.style.position = 'relative';
+ theWrapper.style.display = 'block';
+ theWrapper.style.width = w + 'px';
+ theWrapper.style.height = h + 'px';
+ $(wrapper).append(theWrapper);
+
+ var image1 = new Image();
+ image1.src = i1;
+
+ var image2 = new Image();
+ image2.src = i2;
+
+ var span1 = document.createElement('span');
+ span1.id = 'IS_imageOne';
+ span1.style.position = 'absolute';
+ span1.style.width = w + 'px';
+ span1.style.height = h + 'px';
+ span1.style.top = '0';
+ span1.style.left = '0';
+ span1.style.overflow = 'hidden';
+ span1.style.zIndex = '1';
+ $(theWrapper).append(span1);
+ $('#IS_imageOne').append(image1);
+
+ var span2 = document.createElement('span');
+ span2.id = 'IS_imageTwo';
+ span2.style.position = 'absolute';
+ span2.style.borderRight = '2px solid #FFF';
+ span2.style.width = w/2 + 'px';
+ span2.style.height = h + 'px';
+ span2.style.top = '0';
+ span2.style.left = '0';
+ span2.style.overflow = 'hidden';
+ span2.style.zIndex = '2';
+ $(theWrapper).append(span2);
+ $('#IS_imageTwo').append(image2);
+
+ var control = document.createElement('div');
+ control.className = 'IS_control';
+ control.style.position = 'relative';
+ control.style.width = w + 'px';
+ control.style.height = '10px';
+ control.style.margin = '10px 0';
+ control.style.border = '1px solid #CCC';
+
+ var button = document.createElement('div');
+ button.className = 'IS_button';
+ button.style.position = 'absolute';
+ button.style.left = w/2-10 + 'px'; // w/2 pra dar metade, -10px por ser metade do width do elemento (20px)
+ button.style.zIndex = '3';
+ button.style.width = '20px';
+ button.style.height = '20px';
+ button.style.marginTop = '-6px';
+
+ $(wrapper).append(control);
+ $('.IS_control').append(button);
+
+ // drag & drop
+ $('.IS_button').draggable({
+ axis: 'x',
+ containment: [0, 0, w, 0],
+ handle: '.IS_control'
+ }).addTouch();
+
+ $('.IS_button').draggable({
+ drag: function(){
+ var buttonPosition = $(this).position();
+ $('#IS_imageTwo').css('width', buttonPosition.left+10);
+ }
+ });
+}
File renamed without changes.
File renamed without changes.
View
Oops, something went wrong.
File renamed without changes.
Oops, something went wrong.
Oops, something went wrong.

0 comments on commit ab6fb93

Please sign in to comment.