I need your help. I'm using LoadGo JQuery and would like to know how do I call a certain function to load automatically from the body
tag, so that when you click the page, it opens automatically. I tried to put it like this: body onload="execute('shield', 1, shieldInterval);">
but did not work. What should I do?
Follow the example:
index.html
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="css/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="css/bootstrap/css/bootstrap-theme.min.css">
<link rel="stylesheet" type="text/css" href="js/libs/font-awesome-4.5.0/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<!-- NAO FUNCIONOU DESTA MANEIRA
<body onload="execute('shield', 1, shieldInterval);">
-->
<body>
<div class="container">
<img id="shield" src="logos/shield.png" alt="shield Logo" class="img-responsive logo" style="margin: 0 auto;" />
<div class="row" style="margin-top:10px;">
<div class="col-md-12 text-center">
<div id="progress-1" style="margin-bottom:10px;font-size:32px; font-family:'Campton ExtraBold Italic'; color: #000000; opacity:0"><cite>0 %</cite></div>
</div>
<center><button class="btn btn-primary" onclick="execute('shield', 1, shieldInterval);">
Start
</button></center>
</div>
</div>
</body>
<script type="text/javascript" src="js/libs/jquery-1.11.2.min.js"></script>
<script type="text/javascript" src="js/libs/bootstrap.min.js"></script>
<script type="text/javascript" src="js/loadgo/loadgo.js"></script>
<script type="text/javascript" src="js/main_loadgo.js"></script>
</html>
file.js
var shieldInterval;
function execute (_id, index, interval) {
$('#msg-' + index).animate({
'opacity': '0'
});
$('#progress-' + index).animate({
'opacity': '1'
});
var p = 0;
$('#' + _id).loadgo('resetprogress');
$('#progress-' + index).html('0%');
window.setTimeout(function () {
interval = window.setInterval(function (){
if ($('#' + _id).loadgo('getprogress') == 100) {
window.clearInterval(interval);
$('#msg-' + index).animate({
'opacity': '2'
});
$('#progress-' + index).animate({
'opacity': '0'
});
}
else {
var prog = p*1;
$('#' + _id).loadgo('setprogress', prog);
$('#progress-' + index).html(prog + '%');
p++;
}
}, 150);
}, 300);
}
$(window).load(function () {
$("#shield").load(function() {
//referencia principal da chamada, olhar em <img id="shield" ... dentro do index.html
$('#shield').loadgo();
}).each(function() {
if(this.complete) $(this).load();
});
});
Thanks for the help!