salve a tutti ho realizzato un setInterval con jQuery in modo tale che il testo dell'elemento selezionato aumenti con un intervallo di 1sec di 5px, ora vorrei, però, che una volta raggiunti i 5 cicli, ad esempio da 50px a 75px, l'interval si stoppi, sulla console di firebug poco prima di eseguire un redirect mi esce un errore se poi torno indietro, si nota il continuo ridimensionamento del testo
HTML
codice:
<!DOCTYPE html>
<html lang="it">
<head>
<meta charset="utf-8" />
<!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame
Remove this if you use the .htaccess -->
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<title>Redirect</title>
<meta name="author" content="Giuseppe Lomurno" />
<meta name="viewport" content="width=device-width; initial-scale=1.0" />
<link href="style.css" rel="stylesheet" type="text/css" media="screen" />
<link href='http://fonts.googleapis.com/css?family=Delius+Unicase' rel='stylesheet' type='text/css'>
<script src="jsRedirect.js"></script>
<script src="jquery-1.6.4.js"></script>
<script src="functions.js"></script>
</head>
<body onload="coolRedirect('http://thenextgen.altervista.org/blog/');">
<div id="content">
<div id="COOL_REDIRECT">
<span id="redLabel">countdown</span>
<span id="count">5</span>
</div>
<div id="redirectMsg"></div>
</div>
</body>
</html>
CSS
codice:
body {
background-color: black;
background-image: url('img/200619102909-720.jpg');
overflow: hidden;
background-position: center top;
border: 0;
padding: 0;
}
div#content {
background-color: rgba(0, 0, 0, 0.3);
position: absolute;
width: 100%;
height: 100%;
border: 0;
padding: 0;
top: 0;
left: 0;
}
div#COOL_REDIRECT {
width: 20%;
height: 100px;
position: absolute;
right: 10px;
top: 10px;
color: blue;
border: 1px solid transparent;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
background-color: rgba(0, 0, 0, 0.4);
}
span#redLabel {
display: block;
width: 98%;
height: 25px;
font-size: 14px;
line-height: 25px;
padding-left: 5px;
color: white;
font-family: 'Delius Unicase', cursive;
text-align: center;
text-transform: uppercase;
background-color: black;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
div#redirectMsg {
width: 50%;
height: 150px;
border: 1px solid red;
background: black;
opacity: 0;
color: white;
}
span#count {
display: block;
font-size: 50px;
line-height: 75px;
text-align: center;
color: #DFDFDF;
}
JavaScript functions.js
codice:
/**
* @author Giuseppe Lomurno
*/
$(document).ready(function(){
$('#redirectMsg').animate({
opacity: 0.75
}, 5000);
var interval = setInterval("$('#count').css('fontSize','+=5');", 1000);
var stop = setTimeout("windows.clearTimeout(interval)", 5000);
});
JavaScript jsRedirect.js
codice:
function coolRedirect(url, msg)
{
var TARG_ID = "count";
var DEF_MSG = "Redirecting...";
if (!msg) {
msg = DEF_MSG;
}
if (!url) {
throw new Error('Non hai incluso il parametro "url"');
}
var e = document.getElementById(TARG_ID);
if (!e) {
throw new Error('"count" element id not found');
}
var cTicks = parseInt(e.innerHTML);
var timer = setInterval(function() {
if (cTicks) {
e.innerHTML = --cTicks;
} else {
clearInterval(timer);
document.getElementById('redirectMsg').innerHTML = msg;
location = url;
}
}, 1000);
}