Div trascinabile con gli Script.aculo.us

Un caratteristica interessante di Rails è che ha già impacchettati i famosi Script.aculo.us, script che consentono di creare pagine graficamente dinamiche. Ad esempio è possibile creare un div simile ad una finestra (cliccabile e trascinabile con il mouse) in poche righe di codice.

Nella view scriveremo

<%= javascript_include_tag "prototype" %>
<%= javascript_include_tag "scriptaculous" %>

per importare i Javascript necessari

Poi creeremo un Div e lo chiameremo "finestra"

  <div id="finestra">  clicca su di me per trascinarmi!  </div> 

Ora modifichiamo il css a lui appicato

#finestra {

position: absolute;
z-index: 70;
height: 400px;
width: 300px;
top: 20px;
right: 300px;
background-color: #FFFFDD;

}

Ora inseriamo uno script appena dopo <div id="finestra">

 <script type="text/javascript"> new Draggable('finestra'); </script> 

Il gioco è fatto, avremo un div che si comporterà come una finestra...

Referenze

Sito ufficiale di Ruby On Rails: www.rubyonrails.org

Sito ufficiale degli Script.aculo.us

Ciao Piero