jQuery को काम करने के लिए आकार बदलने योग्य नहीं मिल सकता: मैं गलत क्या कर रहा हूं?

jQuery का आकार बदलने योग्य काम कर रहा है, तो कोशिश करने और परीक्षण करने के लिए मेरा सरल कोड यहां दिया गया है। मैं google.load का उपयोग करके बस अन्य jQuery घटकों का उपयोग करता हूं, और मैंने बिना किसी अंतर के स्थानीय संस्करण के लिए google.load को स्वैप करने का प्रयास किया है। मैंने 3 ब्राउज़रों में परीक्षण किया है, मैंने कई डेमो/ट्यूटोरियल साइटों से कोड कॉपी किया है (जहां यह उनकी साइट पर काम करता है)।jQuery को काम करने के लिए आकार बदलने योग्य नहीं मिल सकता: मैं गलत क्या कर रहा हूं?

<!DOCTYPE html> 
<html> 
<head> 
<script type="text/javascript" src="http://www.google.com/jsapi?key=blahblah_obviously changed_blahblah-blahblah_blah_blahblahblah"></script> 
<script type="text/javascript">google.load("jquery", "1.3.2");google.load("jqueryui", "1.7.1");</script> 
<style type="text/css"> 
    #resizable { width: 100px; height: 100px; background: silver; } 
</style> 
<script type="text/javascript"> 
    $(document).ready(function(){ 
    $("#resizable").resizable(); 
}); 
</script> 
</head> 
<body> 
<div id="resizable"></div> 
</body> 
</html>

मुझे कोई त्रुटि संदेश नहीं मिला है। मेरा विवेक खत्म हो रहा है। मैं क्या गलत कर रहा हूं? यह साधारण मामला क्यों काम नहीं करता है?

अद्यतन: jQuery UI पुस्तकालयों को google.load ("jqueryui", "1.7.1") पंक्ति में शामिल किया गया है;

<script type="text/javascript"> 
google.setOnLoadCallback(function() { 
    $(function() { 
    $("#resizable").resizable(); 
    }); 
}); 
</script>

ऐसा नहीं है कि google.load (ध्यान देने योग्य है) एक async कॉल है और आप jQuery कार्यों कॉल कर पाएंगे, जब तक वे इसलिए कॉलबैक लोड कर रहे हैं नहीं होगा:

स्रोत

2009-03-29 MECU

मैं jQuery और उनके अधूरा उदाहरण नफरत (स्थानीय करने के लिए छवि को बचाने के लिए मत भूलना)! यह यहाँ है जैसे आप जाते हैं, आप भाग्यशाली हैं अगर आप इसे समझ सकते हैं: पी –

jQuery यूआई अपने नमूने में ठीक काम कर रहा है, इस मुद्दे को आप है क्योंकि आप किसी भी सीएसएस थीम अपने last test में शामिल नहीं है, और "आकार बदलने योग्य हैंडल "आइकन नहीं दिखाया गया है।

अपने own theme या डिफ़ॉल्ट एक जोड़ें:

<link rel="stylesheet" type="text/css" 
href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/themes/base/jquery-ui.css"/>

अपने नमूना here देखें।

स्रोत

2009-03-29 04:34:13 CMS

इस स्टाइलशीट लिंक को जोड़कर इसे हल किया गया। धन्यवाद! – MECU

कमाल! धन्यवाद! – rilar

आप कोशिश की है।

ठीक है, अपने उदाहरण पर एक नज़र था और आप कुछ समस्याओं मिल गया है:

यह सबसे बड़ी है: आप कोई jQuery यूआई स्टाइलशीट है;
आप Google और स्थानीय दोनों से jQuery, jQuery UI और SWFObject सहित डबल हैं;
आपके आकार बदलने योग्य div के अंदर अंतिम div आकार बदलना अवरुद्ध कर रहा है। निश्चित रूप से क्यों नहीं, लेकिन मैंने इसे टिप्पणी की और यह ठीक काम करता है; और
आपको Google की AJAX लाइब्रेरी API के लिए एपीआई कुंजी की आवश्यकता नहीं है। यह एक समस्या का कारण नहीं है। यह सिर्फ एफवाईआई है। तुम्हारा

कार्य संस्करण:

<html> 
<head> 
<meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/themes/blitzer/jquery-ui.css"> 
<script type="text/javascript" src="http://www.google.com/jsapi"></script> 
<script type="text/javascript"> 
google.load("jquery", "1.3.2"); 
google.load("jqueryui", "1.7.1"); 
google.load("swfobject", "2.1"); 
google.setOnLoadCallback(function() { 
    $(function() { 
    $("#resizable").resizable(); 
    }); 
}); 
</script> 
<style type="text/css"> 
    #resizable { width: 100px; height: 100px; background: silver; } 
</style> 
</head> 
<body> 
<div id="resizable"> 
    <div style="-moz-user-select: none;" unselectable="on" class="ui-resizable-handle ui-resizable-e"></div> 
    <div style="-moz-user-select: none;" unselectable="on" class="ui-resizable-handle ui-resizable-s"></div> 
    <!--<div unselectable="on" style="z-index: 1001; -moz-user-select: none;" class="ui-resizable-handle ui-resizable-se ui-icon ui-icon-gripsmall-diagonal-se"></div>--> 
</div> 
</body> 
</html>

स्रोत

2009-03-29 03:36:59 cletus

यह काम नहीं करता है। साबित करने के लिए मैंने कोशिश की और यह मेरे लिए काम नहीं कर रहा है, goto: http://www.bcsfanpoll.com/test/test.php – MECU

स्टाइलशीट लिंक जोड़ना इसे हल करता है। मैं नहीं देखता कि मैं पुस्तकालयों को दो बार कैसे शामिल कर रहा हूं? वह अंतिम div jQuery (या फ़ायरफ़ॉक्स) द्वारा जोड़ा जा रहा है, यह मेरे बेस कोड का हिस्सा नहीं है। '

' मेरे कोड का हिस्सा है, अंदर कुछ नहीं। नो-एपीआई टिप के लिए धन्यवाद। – MECU

सभी सीएसएस आप काम कर jQuery ui .resizable प्राप्त करने की आवश्यकता():

<style type="text/css"> 
.ui-icon { width: 16px; height: 16px; background-image: url(http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/themes/base/images/ui-icons_222222_256x240.png)/*{iconsContent}*/; } 
.ui-resizable { position: relative;} 
.ui-resizable-handle { position: absolute;font-size: 0.1px;z-index: 99999; display: block;} 
.ui-resizable-disabled .ui-resizable-handle, .ui-resizable-autohide .ui-resizable-handle { display: none; } 
.ui-resizable-n { cursor: n-resize; height: 7px; width: 100%; top: -5px; left: 0px; } 
.ui-resizable-s { cursor: s-resize; height: 7px; width: 100%; bottom: -5px; left: 0px; } 
.ui-resizable-e { cursor: e-resize; width: 7px; right: -5px; top: 0px; height: 100%; } 
.ui-resizable-w { cursor: w-resize; width: 7px; left: -5px; top: 0px; height: 100%; } 
.ui-resizable-se { cursor: se-resize; width: 12px; height: 12px; right: 1px; bottom: 1px; } 
.ui-resizable-sw { cursor: sw-resize; width: 9px; height: 9px; left: -5px; bottom: -5px; } 
.ui-resizable-nw { cursor: nw-resize; width: 9px; height: 9px; left: -5px; top: -5px; } 
.ui-resizable-ne { cursor: ne-resize; width: 9px; height: 9px; right: -5px; top: -5px;} 
.ui-icon-gripsmall-diagonal-se { background-position: -64px -224px; } 
</style>

स्रोत

2011-04-27 12:22:37 Mateusz

jQuery को काम करने के लिए आकार बदलने योग्य नहीं मिल सकता: मैं गलत क्या कर रहा हूं?

उत्तर

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