Componente che permetta l'espansione a sinistra e a destra come in www.liquida.it/search/prova/

popiero · 23 Set 2013

Buon giorno a tutti,
utilizzo il framework ext js per gestire le mie applicazioni web ma non disdegno l'adozione di altre librerie javascript come jquery etc.

Avrei l'esigenza di inserire in una mia window una gestione simile a quella usata nel seguente link http://www.liquida.it/search/prova/

Avete presente il pannello nero con l'effetto di espansione quando ci si va con il mouse ?

Mi potete suggerire un componente che faccia questo ?

Quando si espande a destra dovrà coprire un pannello.

Ho provato con ext js ma la cosa è al quanto farragginosa.
Io credo che quelli di Liquida abbiano utilizzato qualche componente ma non si evince quale.

Accetto suggerimenti, esempi, e quant'altro possa ritornarmi utile allo scopo.

Grazie a tutti e buona giornata

Longo8 · 24 Set 2013

Prova questo codice che ho buttato giù così, l'ho testato e sembra funzionare.

HTML:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script>
$(document).ready(function() {

  $("#div1").hover(
    //on mouseover
    function() {
      $(this).animate({
        width: '+=250' 
        }, 'slow' //sets animation speed to slow
      );
    },
    //on mouseout
    function() {
      $(this).animate({
        width: '-=250px' 
        }, 'slow'
      );
    }
  );

});
</script> 

<style type="text/css">
#div1{
    width:100px;
    overflow:hidden;
    background: red;
}
</style>

<body>
<div id="div1">Div di prova</div>
</body>

Cerca

Cerca

Componente che permetta l'espansione a sinistra e a destra come in www.liquida.it/search/prova/

popiero

Nuovo Utente

Longo8

Utente Attivo

Discussioni simili