5
मैं अपनी एचटीएमएल फाइल के शीर्षलेख में शामिल एक स्क्रिप्ट का उपयोग कर ड्रैगगेबल (ड्रैग & ड्रॉप) चित्र को लागू करने की कोशिश कर रहा हूं। इस परियोजना के लिए मेरे पास 3 अलग-अलग फाइलें हैं; एचटीएमएल, सीएसएस और जेएस। हालांकि, जब मैं इसे अपने लोकहोस्ट पर अपलोड करता हूं, तो ड्रैगगेबल फ़ंक्शन इस समय काम नहीं कर रहा है, यह Jsfiddle पर पूरी तरह से काम कर रहा है।ड्रैगगेबल काम नहीं कर रहा है
body {
margin:0;
height: 595px;
}
#container{
/*background-color:rgb(19,163,174);*/
background-image:url(bg.jpg);
background-repeat: no-repeat;
background-size: cover;
width:100%;
height:595px;
overflow: hidden;
}
#container .background {
width: 100px;
height: 200px;
}
/************************************draggable************************************/
.containment-wrapper {
background:khaki;
overflow: hidden;
padding: 50px;
}
.boxone {
width: 100%;
height: 200px;
background: papayawhip;
border-radius:50px;
margin-bottom: 15px;
}
.boxtwo {
width: 100px;
height: 100px;
border-radius:12px;
background: darkseagreen;
margin-bottom: 15px;
float: left;
}
.boxthree {
width: 100px;
height: 100px;
border-radius:50px;
background: lightcoral;
margin-bottom: 15px;
float: left;
}
मैं भी खींचें और ड्रॉप समारोह के रूप में एक ही पृष्ठ में कुछ अन्य गतिज एनीमेशन शामिल:
<!DOCTYPE HTML>
<html>
<head>
<link href="index-05.css" rel="stylesheet">
<script type="text/javascript" src="index-05.js"></script>
<!--dragonfly animation-->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
<script type="text/javascript" src="jquery-ui-1.9.2.custom.min.js"></script>
<!--<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>-->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<!--<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>-->
<script type="text/javascript" src="kinetic-v5.1.0.js"></script>
<script type="text/javascript" src="tweenmax.min.js"></script>
<!--draggable-->
<script>
$(".boxtwo").draggable({ containment: "#containment-wrapper", scroll: false });
$(".boxthree").draggable({ containment: "parent", scroll: false});
</script>
</head>
<body>
<div id="container"></div>
<div class="containment-wrapper">
<div class="boxone" class="draggable ui-widget-content"></div>
<div class="boxtwo" class="draggable ui-widget-content"></div>
<div class="boxthree"></div>
</div>
</body>
</html>
यहाँ सीएसएस है:
यह एचटीएमएल है। क्या यह समस्या हो सकती है? कृपया सलाह दें। मैं इसमें बहुत नया हूं। पहले ही, आपका बहुत धन्यवाद।
आपके पास jQuery UI के एकाधिक संदर्भ हैं। पूरे या कस्टम का प्रयोग करें। दस्तावेज़ तैयार हैंडलर में अपने jQuery कोड को भी लपेटें –
आपका मतलब यह है ?: – fxrxh
हां, इसे हटा दें। या –