javascript - jQuery UI Snappable Not Returning only Inner Snaps with SnapMode Set -

-

when set draggable object snap span (doing inner-snaps only) seeing returning adjacent snaps, despite being outside of them. notice snapmode, important part:

$(".draggable").draggable({     snap: ".snap",     snapmode: "inner",     stop: function(event, ui) {          /* possible snap targets: */         var snapped = $(this).data('draggable').snapelements;          /* pull out snap targets "snapping": */         var snappedto = $.map(snapped, function(element) {             return element.snapping ? element.item : null;         });          /* display results: */         var result= '';         $.each(snappedto, function(idx, item) {             result += $(item).text() + ", ";         });          $("#results").html("snapped to: " + (result === '' ? "nothing!" : result));     } });

this based upon question:how find out "snapped to" element jquery ui draggable elements on snap

i need "snappable" areas next each other per design i'm trying build towards, so: drag , drop ui example

my jsfiddle demonstrating issue here: http://jsfiddle.net/myingling/dx54dapr/1/

(try snapping snap 2 , you'll see says it's snapping both snap 1 , snap 2!)

snap mode check whether element should snap other elements. snapmode determines edges of snap elements draggable snap to. need put gap between boxes , can use snaptolerance. 

$(".draggable").draggable({      snap: ".snap",      snapmode: "inner",      stop: function(event, ui) {           /* possible snap targets: */          var snapped = $(this).data('ui-draggable').snapelements;                   /* pull out snap targets "snapping": */          var snappedto = $.map(snapped, function(element) {              return element.snapping ? element.item : null;          });                   /* display results: */          var result= '';          $.each(snappedto, function(idx, item) {              result += $(item).text() + ", ";          });                    $("#results").html("snapped to: " + (result === '' ? "nothing!" : result));      }  });
.draggable {       width: 90px;       height: 80px;       padding: 5px;       font-size: .9em;   }    .snap {       width: 300px;       height: 100px;      margin-top: 50px;  }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>  <script    src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"    integrity="sha256-xnjb53/ry+wmg+4l6ttl9m6ppqknwzvrt0ro1srnjzw="    crossorigin="anonymous"></script>  <link href="https://ajax.microsoft.com/ajax/jquery.ui/1.8.7/themes/black-tie/jquery-ui.css" rel="stylesheet"/>    <div id="snap-one" class="snap ui-widget-header">snap 1</div>  <div id="snap-two" class="snap ui-widget-header">snap 2</div>    <div class="demo">      <br clear="both" />            <div id="draggable" class="draggable ui-widget-content">          <p>oh snap!</p>      </div>      <div id="results"></div>  </div>


Comments

Post a Comment

Popular posts from this blog

ios - MKAnnotationView layer is not of expected type: MKLayer -

-
Image
so code works fine logger riddled message. there way rid of or suppress it? postannotation.swift class postannotation: mkpointannotation { //mark: properties let post: post //mark: initialization init(post: post) { self.post = post super.init() self.coordinate = cllocationcoordinate2d(latitude: post.latitude, longitude: post.longitude) self.title = post.title self.subtitle = post.timestring() } } adding annotation let annotation = postannotation(post: post) self.map.addannotation(annotation) func mapview func mapview(_ mapview: mkmapview, viewfor annotation: mkannotation) -> mkannotationview? { if annotation mkuserlocation { return nil } var annotationview = mapview.dequeuereusableannotationview(withidentifier: "pin") as? mkpinannotationview if annotationview == nil { annotationview = mkpinannotationview(annotation: annotation, reuseidentifier: "pin")
Read more

ZeroMQ on Windows, with Qt Creator -

-
i have installed zmq link given below on windows 7. http://zeromq.org/distro:microsoft-windows 1) have c++ project in qt-creator , i'm using zmq c++ binding (zhelpers.hpp etc). 2) have added .lib installed zmq folder qtcreator 3) while compiling, compiler looks _imp__zmq_verion, in .dll files present in .lib have __imp_zmq_version. 4) causing undefined reference zmq_version. anyone else faced problem , has solution ?
Read more

unity3d - Unity SceneManager.LoadScene quits application -

-
i have 2 different scenes 1 named 'main' , other 'game' both added scenes in load. when use scenemanager.loadscene("game"); works no problem when tried return main scene code if (input.getkeydown (keycode.escape)) { scenemanager.loadscene("main"); } strangely game quits. thanks. sorry interruption. somewhere on other script found code. if (input.getkeydown (keycode.escape)) { application.quit (); } that's bad, know...
Read more