jQuery .slideRight प्रभाव

Question

मुझे स्क्रीन के दाईं ओर स्लाइड करने के लिए एक div टैग की आवश्यकता है, मैं jQuery के साथ यह प्रभाव कैसे प्राप्त करूं? मैं यहां देख रहा हूं: http://api.jquery.com/category/effects/sliding/ और ऐसा लगता है कि मैं क्या देख रहा हूं ...

Answer 1

यदि आप jQuery के अलावा jQuery UI लाइब्रेरी को शामिल करने के इच्छुक हैं, तो आप बस इस प्रकार, hide(), with additional arguments का उपयोग करें:

$(document).ready(
    function(){ 
     $('#slider').click(
      function(){ 
       $(this).hide('slide',{direction:'right'},1000); 

      }); 
    }); 

JS Fiddle demo। jQuery UI का उपयोग बिना

---

, तो आप सिर्फ animate() का उपयोग कर अपने लक्ष्य को हासिल कर सकते हैं:

$(document).ready(
    function(){ 
     $('#slider').click(
      function(){ 
       $(this) 
        .animate(
         { 
          'margin-left':'1000px' 
          // to move it towards the right and, probably, off-screen. 
         },1000, 
         function(){ 
          $(this).slideUp('fast'); 
          // once it's finished moving to the right, just 
          // removes the the element from the display, you could use 
          // `remove()` instead, or whatever. 
         } 
         ); 

      }); 
    }); 

JS Fiddle demo

आप jQuery UI का उपयोग करने के लिए चुनते है, तो मैं को जोड़ने की सलाह देते हैं Google द्वारा होस्ट किया गया कोड, https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/jquery-ui.min.js

Answer 2

एक और समाधान .animate() और उचित सीएसएस का उपयोग करके है।

उदा।

$('#mydiv').animate({ marginLeft: "100%"} , 4000);