jQuery .slideEffetto destro

Question

Ho bisogno di un tag div per farlo scorrere sul lato destro dello schermo, come faccio a ottenere questo effetto con jQuery? Ho cercato qui: http://api.jquery.com/category/effects/sliding/ e non sembra essere quello che sto cercando ...

Answer 1

Se vuoi includere la libreria jQuery UI, oltre a jQuery, puoi semplicemente utilizzare hide(), with additional arguments, come segue:

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

      }); 
    }); 

JS Fiddle demo.

---

Senza usare jQuery UI, si potrebbe raggiungere il tuo obiettivo usando solo 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

Se si sceglie di utilizzare jQuery UI, allora vi consiglio il collegamento al Codice ospitato da Google, al numero: https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/jquery-ui.min.js

Answer 2

Un'altra soluzione è usare .animate() e il CSS appropriato.

ad es.

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