Jquery sortable ड्रैग और ड्रॉप 'चाल' कर्सर

मैं इस सूची का उपयोग कर इस सूची का उपयोग कर रहा हूं। मेरी समस्या यह है कि मैं चाहता हूं कि ड्रैग और ड्रॉप का उपयोग किया जा रहा हो, और पॉइंटर कर्सर केवल होवर पर चलने वाला कर्सर दिखाए। मेरे पास कर्सर को कॉल करने वाला मेरा सीएसएस है: होवर पर पॉइंटर, लेकिन ऐसा लगता है कि यह कर्सर को बिल्कुल नहीं दिखाता है। बाकी सब कुछ ठीक काम करता है। नीचे कोडJquery sortable ड्रैग और ड्रॉप 'चाल' कर्सर

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
    <html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.4/jquery-ui.min.js"></script> 
    <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.3/themes/base/jquery-ui.css" type="text/css"/> 
    <link rel="stylesheet" href="blah.css" type="text/css" /> 
    <script type="text/javascript" charset="UTF-8"> 
    $(document).ready(function() 
    { 
    $("#sortable").sortable({ 
     /*helper: 'clone', Tried this =(*/ 
     distance: 5, 
     delay: 300, 
     opacity: 0.6, 
     cursor: 'move', 
     update: function() {} 
    }); 
    }); 
    </script> 
    </head> 
    <body> 
    <ul id="sortable"> 
     <li class="ui-state-default">Item 1</li> 
     <li class="ui-state-default">Item 2</li> 
     <li class="ui-state-default">Item 3</li> 
    </ul> 
    </body> 
    </html>

अलग सीएसएस दस्तावेज़ में शामिल हैं:

#sortable { list-style-type: none; margin: 0; padding: 0; width: 60%; } 
#sortable li { margin: 0 3px 3px 3px; padding: 0.4em; padding-left: 1.5em; font-size: 1.1em; line-height: 18px; height: 18px; } 
#sortable li span { position: absolute; margin-left: -1.3em; } 

/* HERE'S THE IMPORTANT STUFF! */ 
#sortable li:hover { 
    cursor: pointer; 
} 

#sortable li.ui-sortable-helper { 
    cursor: move; 
}

किसी भी मदद की बहुत सराहना की जाएगी। अग्रिम में धन्यवाद। =)

शायद एक छोटे से अधिक जानकारी। यह थोड़ी देर के वक्त से एक डीबी आबादी सूची है। प्रत्येक सूची आइटम एक लिंक है, इसलिए मैं इसे {कर्सर: पॉइंटर;} विकल्प प्रदर्शित करना चाहता हूं। लेकिन जब इसे खींचा जाता है तो मुझे इसे {कर्सर: चाल;} प्रदर्शित करने की आवश्यकता होती है। मैंने सोचा होगा कि ऊपर दिया गया कोड यह करेगा लेकिन यह काम नहीं कर रहा है। मैंने खुद को पहली पोस्ट के साथ भ्रमित कर दिया ताकि सोचा कि मैं इसे थोड़ा बेहतर समझूंगा।

स्रोत

2011-11-02 banjo

आप अपने प्रश्न को संपादित कर सकते हैं और टिप्पणियों के रूप में इसे जोड़ने के बजाय अतिरिक्त जानकारी जोड़ सकते हैं। दूसरों के जवाब देने में आपकी सहायता के लिए अधिक जानकारी के लिए पूछने के लिए टिप्पणियां अधिक हैं। –

ऐसा हुआ - अगर आपको मौका मिलता है तो आप टिप्पणी को हटा सकते हैं। – polarblau

अभी भी इस साइट के लिए नया खेद है। =) – banjo

समस्या, प्रतीत हो रहा है कि अपने सीएसएस सेटिंग सभी राज्यों में प्रयोग किया जाता है।

आप इस के आसपास सीएसएस के माध्यम से "खींच" के रूप में अच्छी तरह से करने के लिए कर्सर की स्थापना करके प्राप्त कर सकते हैं: http://jsfiddle.net/mWYEH/

स्रोत

2011-11-02 14:22:42 polarblau

बिल्कुल सही! बहुत बहुत धन्यवाद। =) मैं अपने पोते के लिए कहानियों को बताऊंगा। – banjo

ठीक है ऐसा लगता है कि मैं गलत था। यह और काम नहीं कर रहा है। मैंने उपरोक्त पोस्ट को मेरे पास जो संपादित किया है (परीक्षण के लिए नकली संस्करण) संपादित किया है। क्या आप देख सकते हैं कि मैं क्या गलत कर रहा हूं? – banjo

नहीं, मेरे लिए ठीक लगता है और अगर मैं इसका परीक्षण करता हूं तो काम करता है। आप संभवतः शैलियों को एक अलग जगह पर ओवरराइड कर रहे हैं। क्या आपके पास परियोजना कहीं कहीं है? इस समय केवल – polarblau

मिले यह करने के लिए एक कम कुंद तरीका:

#contentLeft li:hover { 
    cursor: pointer; 
} 

#contentLeft li.ui-sortable-helper{ 
    cursor: move; 
}

यहाँ एक उदाहरण है

#contentLeft li:not(.ui-sortable-helper) { 
    cursor: pointer; 
}

स्रोत

2011-12-13 01:14:00

किसी और के लिए एफवाईआई जो ': नहीं()' का उपयोग करने का प्रयास कर सकता है। यह पुराने ब्राउज़र में समर्थित नहीं है अगर यह आपके लिए एक समस्या है। http://www.w3schools.com/cssref/sel_not।एएसपी – praneetloke

<ul id="sortable"> 
     <li class="ui-state-default" style="cursor:pointer;">Item 1</li> 
     <li class="ui-state-default" style="cursor:pointer;">Item 2</li> 
     <li class="ui-state-default" style="cursor:pointer;">Item 3</li> 
</ul>

सीएसएस से निकालें। क्योंकि मुझे भी एक ही समस्या का सामना करना पड़ता है। और मैं सिर्फ मैं यहाँ

स्रोत

2014-03-05 12:51:24 Nadeem

कृपया इनलाइन शैलियों का उपयोग न करें, विशेष रूप से स्टाइलशीट में परिभाषित शैलियों को ओवरराइड न करें। इसका कारण यह है कि इनलाइन शैलियों की उच्च प्राथमिकता है। लेकिन समाधान खराब रखरखाव की कीमत पर आता है। – polarblau

क्या लिखना इस प्रयास करें कार्य करें:

$element.droppable({ 
    over: function() { 
    $('body').css('cursor','copy'); 
    }, 
    out: function() { 
    $('body').css('cursor','no-drop'); 
    }, 
});

यह उपयोगकर्ता को इंगित करेगा अगर खींचने योग्य एक droppable से अधिक है।

स्रोत

2017-12-05 07:18:45 yPhil

Jquery sortable ड्रैग और ड्रॉप 'चाल' कर्सर

उत्तर

संबंधित मुद्दे