css pointer-events-Eigenschaft ändern und die entsprechenden jquery-events nicht auslösen zusammen

Hier ist mein code-segment. Ich bin mit iscroll 4 scrollen Sie in der touch-Geräte und desktop.

$('#next_item').bind('mousedown touchstart',function (e) {
        //do something onclick
        $(this).bind('mousemove touchmove',function(e){ //triggers only when i drag over it                 
                dragstart = true;
                $(this).css('pointer-events', 'none');
                myScroll._start(myDown);
                return;                     
        });
});

$('#next_item').bind('mouseup touchend',function (e) {
     if(dragstart) {
        dragstart = false;
        $(this).css('pointer-events', 'auto');
     }
});

Habe ich das click-Ereignis auf #next_item was macht eine bestimmte Aufgabe, und auch die drag-event auf #next_item welche keine andere Aufgabe. Das problem ist jetzt, wenn #next_item erhält drag-Ereignis der css pointer-events geändert none sofort, aber die ziehen nicht auslösen. Wenn ich mouseup und dann wieder ziehen Sie aus über #next_item dann nur das ziehen ausgelöst wird. Ich brauche die css pointer-events übergeben drag-event für das zugrunde liegende element. Bitte schlagen, wenn ich mache etwas falsch. Ohne pointer-events iscroll gibt Fehler, indem Sie die drag-event unter #next_item

Welche version von jQuery benutzt du? Haben Sie versucht, jQuery on Funktion statt bind. denken Sie daran, diese Arbeit mit jQuery 1.7+ version finden Sie api.jquery.com/on
Ich bin mit jquery 1.6.2
Ich habe versucht, mit jquery on Funktion und jquery version 1.7. Es funktioniert in der desktop -, aber könnte nicht machen, es funktioniert auf dem ipad oder iphone. Können Sie on Funktion in meinem code-snippet und zeigt mir die arbeiten.
Hallo, bitte diese URL müssen Sie addEventListener für touch auf dem ipad oder iphone code.google.com/p/jquery-ui-for-ipad-and-iphone Hoffe, das löst dein problem, wenn nicht bitte lassen Sie mich wissen, stellen es als Antwort, so dass andere sich beziehen können.
Ich konnte nicht damit es funktioniert. Können Sie näher, indem Sie zeigen, wie es in meinem code. mymove und mydown konnte nicht herausfinden, wie zu verwenden

InformationsquelleAutor user850234 | 2012-01-18

6
1. Wenn Sie möchten, deaktivieren Sie das pointer-event für ein element mit .css():
```
$('#element_id').css('pointer-events','none');
```
2. Wenn Sie möchten, aktivieren Sie das Zeiger-event für ein element mit .css():
```
$('#element_id').css('pointer-events','');
```
In #1, das element wird deaktiviert, und dann können Sie nicht auf das element.

In #2 das selbe element wird aktiviert, und Sie können führen Sie andere jQuery-Betrieb auf.

InformationsquelleAutor Rohan Katkar

Habe ich mehr Glück gehabt mit den Methoden bereitgestellt, mit iScroll eher als rollende meine eigenen. Insbesondere onBeforeScroll und onScrollEnd.

var myScroll;

function loaded() {
    myScroll = new iScroll('scroller-parent', {
        onBeforeScrollStart: function () {
            $('#scroller').css('opacity',0.5); //just for a visual ref
            return false;
        },
        onScrollEnd: function () {
            alert('done');
            $('#scroller').css('opacity',1);
        }
    });
}

document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);
document.addEventListener('DOMContentLoaded', function () { setTimeout(loaded, 200); }, false);

Auch, die Einbeziehung der Zuhörer für touch und dem DOM helfen. Ich wünschte, ich wusste genau, was Sie versuchen zu tun - in der Lage sein könnte, Ihnen zu zeigen, ein besseres Beispiel.

Wenn ich bin Weg, ich werde ziehen Sie diese Antwort. BTW, jQ 1.6.4 arbeiten gut für diese Antwort.

HTH

InformationsquelleAutor Dawson

Gehören die folgenden <script> in Ihre Seite ein:

HTML

<head>
  <script src="http://code.jquery.com/jquery.min.js"></script>
  <script src="http://code.jquery.com/ui/1.8.17/jquery-ui.min.js"></script>
  <script src="jquery.ui.touch-punch.min.js"></script>
  <script>
    $(document).ready(function () {
      $('#widget').draggable();   //This is required for drag...
      $('#widget').dialog().addTouch();

      //Here you call your functions and perform
      //the functionality for touch and drag...

    });
   </script>

</head>
<body>
  <div id="widget" style="width:200px; height:200px border:1px solid red" ></div>
</body>

Es ist nur ein Beispiel, da bin ich gar nicht wissen, was Funktionen, die Sie wollen aus Ihrem code-snippet. Es kann nicht die Antwort auf Ihre ganzen Fragen, aber dies ist die logische flow erforderlich, um das problem zu lösen.

InformationsquelleAutor Murtaza

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.