Jquery cambio di stato

**felixsuperstar** · 06-08-2012, 19:46

Ciao a tutti,
sto studiando da poco Jquery e purtroppo non so cosa fare per risolvere questo problema.

Ho un <div> a cui ho dato stile via CSS ed associato uno script basato sulla libreria JQuery Transit.

Vorrei che al click cambiasse sempre colore, mentre invece adesso lo fa soltanto una volta. Il primo colore viene preso dal css, il secondo all'interno dello script.

Grazie anticipatamente.

codice:

<!DOCTYPE html>
<html>
<head>
  <style>

.box{
	width: 250px;
	height: 100px;
	margin: 0 auto;
	background: #2dac00;
	border: solid 5px #e3e3e3;
	cursor: pointer;
	}


	
</style>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  <script src='js/jquery.transit.js'></script>
</head>
<body>

<div class="box"></div>

<script>

$(".box").click(function(){

$('.box').transition({
    perspective: '100px',
    rotateX: '180deg',
    backgroundColor: '#db0000'
    });
});


</script>

</body>
</html>

**lucavizzi** · 06-08-2012, 20:17

codice:

<!DOCTYPE html>
<html>
<head>
  <style>

.box{
	width: 250px;
	height: 100px;
	margin: 0 auto;
	background: #2dac00;
	border: solid 5px #e3e3e3;
	cursor: pointer;
	}


	
</style>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  <script src='js/jquery.transit.js'></script>
</head>
<body>

<div class="box"></div>

<script>
//qui definisci la sequenza di colori
var arrayColory=new Array('#000000','#123456','#666666','#999999');

var arrId=0;

$(".box").click(function(){
arrId<arrayColori.length ? arrId++ : arrId=0;
$('.box').transition({
    perspective: '100px',
    rotateX: '180deg',
    backgroundColor: arrayColori[arrId]
    });
});


</script>

</body>
</html>

**felixsuperstar** · 06-08-2012, 20:29

così ho la possibilità di avere molti colori ma io vorrei lavorare sul cambio di stato. Da....A... forse ho sbagliato la logica di quanto fatto e dovrei ottnerlo con un :hover.

**cavicchiandrea** · 06-08-2012, 21:23

qui hai visto? (consapevole che funziona solo con le ultime versioni dei browser)

Discussione: Jquery cambio di stato

Strumenti discussione

Ricerca discussione

Visualizza

Jquery cambio di stato

Re: Jquery cambio di stato

Permessi di invio