Exploding Garrmondo Weiner Interactive Swiss Army Penis

Exploding Garrmondo Weiner Interactive Swiss Army Penis (http://www.gamingforce.org/forums/index.php)
-   Help Desk (http://www.gamingforce.org/forums/forumdisplay.php?f=36)
-   -   Page doesn't run well on Opera (http://www.gamingforce.org/forums/showthread.php?t=15695)

takeru Dec 6, 2006 11:44 AM
Page doesn't run well on Opera
 
Hi, I'm gonna paste you the code of a web page I'm creating. It works well on firefox 2.0 but not on Opera 9.02. My biggest problem is the JS (you'll see the code at the end). In general, it runs a function which modifies styles to make a pseudo-pre-loader bar effect :grin: (it's still on developing). What I see on Opera is the bar fixed (we could say, at 100%), where is supposed to grow (from 0% to 100%), I dunno if you understand what I say. Is problem of JS, problem of styles...?

One more question for you, because google is not my friend in this case and doesn't help, neither wookiepedia :P. I don't understand the difference when you use JS and defines the script as 'javascript' and 'javascript 1.x'. Does it have differences for browsers? In addiction, if I used a function defined just as 'javascript', would browser 'understand' which version of JS to use? I don't know if I'm saying nonsenses. Maybe yes :P

Give it a try, and thank you guys ;)

::CODE::

<!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>
<style type="text/css">
* {
margin: 0;
padding: 0;
border: 0;
font-size: 1em;
font-weight: normal;
font-style: normal;
text-decoration: none;
}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>.:: Welcome to My Site ::.</title>
</head>

<body style="background-color: #000000; font-family: Arial, Helvetica, sans-serif;">
<div style="top: 0; left: 0; width: 100%; height: 100%; position: fixed; display: table;">
<div style="display: table-cell; vertical-align: middle;">
<div style="margin: 0 auto; width: 496px;">
<table cellspacing="0" style="background-image:url(gra/fondo.gif); border: none; padding: 0px 0px 0px 0px;">
<!-- Fila 1 de la barra de carga -->
<tr id="loading_bar_row1" style="width:496px;">
<td id="loading_bar_1x1" style="height: 15px; width: 13px;" ></td>
<td id="loading_bar_1x2" style="height: 15px; width: 469px;"></td>
<td id="loading_bar_1x3" style="height: 15px; width: 14px;" ></td>
</tr>
<!-- Fila 2 de la barra de carga -->
<tr id="loading_bar_row2" style="width:496px">
<td id="loading_bar_2x1" style="height: 34px; width: 13px;" ></td>
<td id="loading_bar_2x2" style="height: 34px; width: 469px;">
<table style="background-image:url(gra/fondo.gif); border: none; padding: 0px 0px 0px 0px; width:469px"
cellspacing="0">
<tr>
<td id="bar_1x1" style="background-color: #dbdbdb; height: 1px; width: 1px;"></td>
<td id="bar_1x2" style="background-color: #dbdbdb; height: 1px; width: 0%;"></td>
<td id="bar_1x3" style="background-color: #000000; height: 1px; width: 100%;"></td>
</tr>
<tr>
<td id="bar_2x1" style="background-color: #dbdbdb; height: 32px; width: 1px;"></td>
<td id="bar_2x2" style="background-color: #777777; height: 32px; width: 0%;">
<div style="height: 32px; text-align: center; width: 469px;">
<span id="bar_text" style="text-transform: uppercase;
color: White; font-size: 10px; line-height: 250%;"></span>
</div>
</td>
<td id="bar_2x3" style="background-color: #000000; height: 32px; width: 100%;"></td>
</tr>
<tr>
<td id="bar_3x1" style="background-color: #000000; height: 1px; width: 1px;"></td>
<td id="bar_3x2" style="background-color: #000000; height: 1px; width: 0%;"></td>
<td id="bar_3x3" style="background-color: #000000; height: 1px; width: 100%;"></td>
</tr>
</table>
</td>
<td id="loading_bar_2x3" style="height: 15px; width: 14px;"></td>
</tr>
<!-- Fila 3 de la barra de carga -->
<tr id="loading_bar_row3">
<td id="loading_bar_3x1" style="height: 14px; width: 13px;"></td>
<td id="loading_bar_3x2" style="height: 14px; width: 469px;"></td>
<td id="loading_bar_3x3" style="height: 14px; width: 14px;"></td>
</tr>
</table>
<table cellspacing="0" style="border: none; padding: 0px 0px 0px 0px; width:496px;">
<tr>
<td style="font-size:xx-small; text-align:right; width:496px;">
<a href"#" id="text_skip">Skip >>></a>
</td>
</tr>
</table>
</div>
</div>
</div>
<script language="javascript">
/* var img_matrix = new Array();
var i;

for (i=0; i<=10; i++) {
img_matrix[i] = i;
}

if (x.src.complete) --- siendo x la imagen en sí

alert (img_matrix.length);
*/
var i = 0, j = 0, direc = 3;
var text_change = 10;
carga();
gradiente();

function carga() {
document.getElementById('bar_1x2').style.width='' + i + '%';
document.getElementById('bar_2x2').style.width='' + i + '%';
document.getElementById('bar_3x2').style.width='' + i + '%';
if (i<100) {
i++;
cambia_texto();
setTimeout ("carga();",100);
}
}

function gradiente() {
document.getElementById('text_skip').style.color=' rgb('+j+','+j+','+j+');';
j=j+direc;
if (j>254) {
direc=-3;
}
if (j<1) {
direc=3;
}
setTimeout ("gradiente();",1);
}

function cambia_texto() {
document.getElementById('bar_text').innerHTML = i+'% COMPLETADO';
}
</script>
</body>
</html>


All times are GMT -5. The time now is 12:48 AM.

Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2026, vBulletin Solutions, Inc.