javascript - Getting a before/after slider to show multiple times on a page -


i've got comparison slider showing before , after images towards bottom of page. i'd replicate slider 3 more times on page, i'm unsure needs done code point: http://anna-test.webflow.io/eyebrows

this current code have slider working:

<script>    var inkbox = document.getelementbyid("inked-painted"), colorbox = document.getelementbyid("colored"), fillerimage = document.getelementbyid("inked"); inkbox.addeventlistener( "mousemove", tracklocation, false); function tracklocation(e) {     var rect = fillerimage.getboundingclientrect();     var position = ((e.pagex - rect.left) / fillerimage.offsetwidth)*100;     if (position <= 100) {         colorbox.style.width = position+"%";      } }  inkbox.addeventlistener( "touchstart", tracklocation, false); inkbox.addeventlistener( "touchmove", tracklocation, false);  </script> 

many thanks, alex


Comments

Popular posts from this blog

ubuntu - PHP script to find files of certain extensions in a directory, returns populated array when run in browser, but empty array when run from terminal -

php - How can i create a user dashboard -

javascript - How to detect toggling of the fullscreen-toolbar in jQuery Mobile? -