Ciao

avete presente google maps (mappe.google.it)? Il sito permette di fare un effettino che mi serve come il pane!
Ossia: accanto alla mappa sul lato superiore sinistro c'è una freccina che permette di nascondere la colonna sinistra allargando la mappa (e viceversa se si preme 2 volte).

Io ho approntato un mezzo tentativo che non è del tutto funzionante:
codice:
--- CSS ---
body {background:#fefefe; text-align:center;}
.contenitore {margin: 0 auto; border:2px solid black; display:block; width:700px; min-height:380px;}
.grosso {border:1px solid cyan; min-height:350px; float:right; width:500px;}
.piccino {border:1px solid crimson; min-height:150px; margin-right:520px;}


--- HTML ---
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link rel="stylesheet" href="script.css" />
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
// <![CDATA[ 
$(document).ready(function(){
	var status = 1;
	
	$("a#switcher").click(function(){
		if(status==1) {
			$("#lil").hide("slow");
			$("#big").animate({ 
    	    width: "680px",
	        marginLeft: "10px",
        	marginRight: "10px",
			}, 1000 );
		}
		else {
			$("#big").animate({ 
    	    width: "500px",
	        marginLeft: 0,
        	marginRight: 0,
			}, 1000 );	
			$("#lil").show("slow");
		}
		status = (status+1)%2;

		return false;						   
	});
});
// ]]> 
</script>
</head>

<body>
<div class="contenitore">
<div class="grosso" id="big">DIV GRANDE</div>
<div class="piccino" id="lil">DIVI PICCOLO</div>
</div>
pigia
</body>
</html>

La sparizione del div di sinistra funziona bene, ma la ricomparsa crea dei problemi... in poche parole il comando show("slow") non è abbastanza lento e ne risulta un movimento bruttino (compare troppo presto e finisce sotto il div grande anziché rimanere a lato).

Come faccio?

C'è un modo per eseguire una sequenza tipo:
1) nascondi / sfuma div piccolo
2) allarga div grande

e

1) ridimensiona div grande
2) rivisualizza div piccolo ??

Grazie mille!

Davvero... mi serve per lavoro e non vorrei far figuracce