Note that there are some explanatory texts on larger screens.

plurals
  1. PODiv dragging not as background
    primarykey
    data
    text
    <p>I'm trying to do dragging box, which changes status of checkbox, bot it's not the achievment what I want to do now, I'm trying to reach that my div don't drag as background image. Div have to be not a background image, with possibility to add to it background image.</p> <pre><code>(function($){ $.fn.slideCheckbox = function(){ return this.each(function(){ //init, native js for better performance slidesHolder = document.createElement( 'div' ); slidesHolder.setAttribute( 'class', 'slides_holder' ); slides = document.createElement( 'div' ); slides.setAttribute( 'class', 'slides' ); slidesHolder.appendChild( slides ); slide_on = document.createElement( 'div' ); slide_on.setAttribute( 'class', 'slide_on' ); slide_off = document.createElement( 'div' ); slide_off.setAttribute( 'class', 'slide_off' ); slides.appendChild( slide_on ); slides.appendChild( slide_off ); this.parentNode.insertBefore( slidesHolder, this.nextSibling ); // mouse hold and position var down = false; var clickPos = null; $( slidesHolder ).bind({ mousedown : function( e ){ clickPos = e.pageX; down = true; }, mousemove : function( e ){ if ( !down ) return; // slinkimas i desine if ( clickPos &lt; e.pageX ) { $( slides ).offset({ left: e.pageX - clickPos }); } // slinkimas i kaire if ( clickPos &gt; e.pageX ) { $( slides ).offset({ left: e.pageX - clickPos }); } }, mouseup : function(){ down = false; } }); }); } })(jQuery); $(function(){ $( '#slide_checkbox' ).slideCheckbox(); }); </code></pre> <p>Full example below:</p> <p><a href="http://jsfiddle.net/GomatoX/w2DBU/" rel="nofollow">http://jsfiddle.net/GomatoX/w2DBU/</a></p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload