jQuery Safari/Chrome niezgodność z Draggable własności powstrzymywania

Ten kod działa w Firefox, Internet Explorer, a nie w Safari/Chrome:jQuery Safari/Chrome niezgodność z Draggable własności powstrzymywania

<head> 
    <script type="text/javascript" src="jquery.js"></script> 
    <script type="text/javascript" src="jquery-ui.js"></script> 
    <script> 
     function newDiv() { 
      var div = $('<div id="divNew" style="width: 50px; height: 50px; border: solid 1px; background: Red"></div>'); 
      $('#divParent').append(div); 
      div.draggable(
      { 
       containment: 'parent' 
      }); 
     } 
    </script> 
</head> 
<body> 
    <a href="javascript:;" onclick="newDiv()">new div</a> 
    <div id="divParent" style="width: 500px; height: 500px; border: solid 1px;"></div> 
</body>

w Safari/Chrome The divNew można przesuwać tylko w pionie. jQuery's ta funkcja jest obecnie niezgodna? Używam wersji stabilnej w wersji 1.5.2. Można ją znaleźć tutaj: jQuery 1.5.2

Źródło

2008-11-12 user37122

Spróbuj zastąpić obiekt "rodzica" obiektem DOM ... np. $ ("# DivParent") i sprawdź, czy to działa.

Źródło

2008-11-19 19:17:35

myślę wich masz rację –

Spróbuj zawinąć element divParent div za pomocą innego elementu div, a następnie ustawić opcję powstrzymywania div divity nadrzędnej podczas wprowadzania jej w divParent. Ten pracował dla mnie:

<script> 
     function newDiv() { 
      var divs = 
       $(unescape('%3Cdiv class="divNew" style=""%3E&nbsp;%3C/div%3E')); 
      divs.draggable(
      { 
      containment: $('#a') 
      }); 
      $('#divParent').append(divs); 
     } 
    </script> 
</head> 
<body> 
    <style> 
    .divNew {width: 50px; height: 50px;border: solid 1px; background: Red;} 
    #divParent {width: 500px; height: 500px; border: solid 1px;}; 
    </style> 
    <a href="javascript:;" onclick="newDiv()">new div</a> 
    <div id="a"> 
     <div id="divParent" style=""> <!--<div class="divNew"></div>--> 
     </div>  
    </div> 
</body>

EDIT: Właśnie sobie sprawę, to nie działa całkowicie. Powinieneś dołączyć sprawdzanie, czy przeglądarka jest oparta na webkitach, a następnie ustawić kontener na 1000px zamiast 500px. Błąd wydaje się oczywiście związany z prawidłowym obliczaniem szerokości.

Źródło

2009-01-23 21:23:15 jacobangel

Wydaje się, że to podobne do obliczania pozycji niż szerokość – yoavf

Miałem jakiś podobny problem, w którym moje elementy podlegające przeciągnięciu były absolutnie ustawione i stały się względnie ustawione w przeglądarce Chrome i Safari. Dodawanie! Ważne do pozycji stylu: absolutne wykonane lewę.

Źródło

2009-08-25 14:45:35 user162806

Aby rozwiązać ten problem, musisz zdefiniować WMODE jako inny niż przezroczysty. Właśnie ustawiłem okno wmode = i działa to dobrze we wszystkich przeglądarkach.

Źródło

2010-10-05 14:59:05 Marcus

Jquery UI Metoda przeciągalna nie działa w środowisku Safari i MAC OS X w żaden sposób. Więc gdy kod zapisu rozważyć samo jak:

if(!($browser.safari && navigator.appVersion.indexOf('Mac')!= -1)) { 
    $('div.urid').draggable({ 
     helper: 'clone', 
     opacity: 0.4 
    }); 
}

Podczas wdrożenia przeciągnij i upuść pls rozważyć sam ...

Źródło

2010-12-02 05:51:50 Anes

rozwiązaniem znalazłem jest ustawienie elementu position: absolute !important, :))

Źródło

2011-03-12 11:01:16 anjalis

z najnowszej jQuery to nadal rozwiązanie ... –

i ustawić elementu nadrzędnego w pozycji: relative; – Luke

Pozycja absolutna prawie zadziałała, pomieszany styl strony. To zadziałało dla mnie http://stackoverflow.com/questions/2483943/jquery-ui-sortable-listitem-jumps-to-top-in-safari-and-chrome –

anjalis miałem rację,

position: absolute !important;

działało idealnie dla mnie. Po wypuszczeniu i kliknięciu elementu miałem małe problemy z przeciągnięciem elementu, który wyskoczył z pojemnika. to zrekompensowałoby niewielkie. z position: absolute !important i elementem nadrzędnym, który działał jak zaklęcie.

Źródło

2012-04-08 20:36:59 nathanlampe

jQuery Safari/Chrome niezgodność z Draggable własności powstrzymywania

Odpowiedz

Powiązane problemy