Click to See Complete Forum and Search --> : strangest thing...


Ness_du_Frat
04-28-2005, 06:12 PM
Hello here !!!
I have a question... On my beloved new website ( lol ! ), which I spend months on, I have a crazy thing happening.
Sometimes, the text doesn't appear entirely on the page. As if someone decided to strike a black line accross the page.
This happened on every computer where I tested the page...
Could anyone tell me what it can be ?
I'll give you a screen shot of this ( don't pay attention to the design, the site is not finished )
screenshot (http://psychomoa.free.fr/test.gif)
I'll post the code if necessary...
As somebody already encountered this kind of issue ? it never happened to me before... :confused:
thanks for any suggestions !!!

buntine
04-28-2005, 10:37 PM
Looks like a design issue. Yeah, post some code.

Regards.

ray326
04-28-2005, 11:23 PM
Wow, that black on black doesn't do much for me.

Ness_du_Frat
04-29-2005, 02:27 AM
I have to warn you, the code is.... you'll see ;)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Les Enfants de l'&Ocirc; - version 3.0 - Mayi</title>
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico">
<link rel="stylesheet" href="css1.css" type="text/css" id="pStyle">
<base target="iframe1">
<script src="index.js"></script>
<script type="text/javascript">
<!--
function P7_writeStyles(op,a){ //v1.5 by PVII
if(op==0||document.getElementById){var tS="<sty"+"le type=\"text/css\">";
tS+=a+"<"+"/sty"+"le>";document.write(tS);document.close();}
}
P7_writeStyles(1,'.closed ul{display:none;}.open ul{display:block;}');
var startcolor= new Array(255,255,255); // start color (red, green, blue)
var endcolor=new Array(0,0,0); // end color (red, green, blue)
<!--

//cookie stuff here

var expiration=new Date();
expiration.setFullYear(expiration.getFullYear() + 1);
expiration=expiration.toGMTString();

var diedate=new Date();
diedate.setFullYear(diedate.getFullYear() - 1);
diedate=diedate.toGMTString();

function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) { // if the cookie exists
offset += search.length
end = document.cookie.indexOf(";", offset); // set the index of beginning value

if (end == -1) // set the index of the end of cookie value
end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}

function cookie() {
if(get_cookie('val')==""){
document.getElementById('pStyle').href='css1.css';
} else {
document.getElementById('pStyle').href='css'+get_cookie('val')+'.css';
}

if(get_cookie('title')==""){
document.title="Les Enfants de l'Ô - version 3.0 - Mayi";
} else {
document.title="Les Enfants de l'Ô - version 3.0 - "+get_cookie('title');
}

if(get_cookie('startcolor_red')=="" || get_cookie('startcolor_green')=="" || get_cookie('startcolor_blue')==""){
startcolor=new Array(153,255,153);
} else {
red=get_cookie('startcolor_red');
green=get_cookie('startcolor_green');
blue=get_cookie('startcolor_blue');
startcolor=new Array(red, green, blue);
}
}

function showCookies(){
alert(unescape(document.cookie));
}

function deleteCookie(Name){
document.cookie=Name+"=;expires="+diedate;
}

//-->
</script>

<!--[if gte IE 5]>
<style>
#p7swapmenu ul a {height: 1em;}
</style>
<![endif]-->
<!--[if IE 5]>
<style>
#p7swapmenu li {margin-top: -3px;}
</style>
<![endif]-->
</head>
<body class="body" onload="document.urlForm.cUrl.value='http://psychomoa.free.fr/'+document.getElementById('iframe1').src;cookie()">
<div id="titre"></div>
<div id="logo"></div>
<div id="p7swapmenu">
<ul>
<li id="menu"></li>
<li class="closed" id="p1"><a href="#" onClick="P7_swapClass(1,'p1','open','closed','li');return false" target="_top"><img src="plus.gif" border="0">
Histoire</a>
<ul>
<li><a href="histoire1.htm" onclick="document.urlForm.cUrl.value=this.href">Premi&egrave;re Partie <img src="moins.gif" border="0"></a></li>
<li><a href="histoire2.htm" onclick="document.urlForm.cUrl.value=this.href">Deuxi&egrave;me Partie <img src="moins.gif" border="0"></a></li>
<li><a href="histoire3.htm" onclick="document.urlForm.cUrl.value=this.href">Annexes <img src="moins.gif" border="0"></a></li>
</ul>
</li>
<li class="closed" id="p2"><a href="#" onClick="P7_swapClass(1,'p2','open','closed','li');return false"><img src="plus.gif" border="0">
Personnages</a>
<ul>
<li><a href="#">Premi&egrave;re Partie <img src="moins.gif" border="0"></a></li>
<li><a href="#">Deuxi&egrave;me Partie <img src="moins.gif" border="0"></a></li>
<li><a href="#">G&eacute;n&eacute;alogie <img src="moins.gif" border="0"></a></li>
<li><a href="#">Quickref <img src="moins.gif" border="0"></a></li>
</ul>
</li>
<li class="closed" id="p3"><a href="#" onClick="P7_swapClass(1,'p3','open','closed','li');return false"><img src="plus.gif" border="0">
Galerie</a>
<ul>
<li><a href="#">Premi&egrave;re Partie <img src="moins.gif" border="0"></a></li>
<li><a href="#">Deuxi&egrave;me Partie <img src="moins.gif" border="0"></a></li>
<li><a href="#">Wallpapers <img src="moins.gif" border="0"></a></li>
<li><a href="#">Autres <img src="moins.gif" border="0"></a></li>
</ul>
</li>
<li class="closed" id="p5"><a href="#" onClick="P7_swapClass(1,'p5','open','closed','li');return false"><img src="plus.gif" border="0">
Bonus</a>
<ul>
<li><a href="chat.htm">Tagboard <img src="moins.gif" border="0"></a></li>
<li><a href="#">&szlig;-Lectrices <img src="moins.gif" border="0"></a></li>
<li><a href="#">Chapitres Bonus <img src="moins.gif" border="0"></a></li>
<li><a href="#">Tentacule D&eacute;&ccedil;u <img src="moins.gif" border="0"></a></li>
<li><a href="#">Casting <img src="moins.gif" border="0"></a></li>
<li><a href="#">Espace Membres <img src="moins.gif" border="0"></a></li>
</ul>
</li>
<li class="closed" id="p4"><a href="#" onClick="P7_swapClass(1,'p4','open','closed','li');return false"><img src="plus.gif" border="0">
Divers</a>
<ul>
<li><a href="test4/faq.htm">Livre de Platine <img src="moins.gif" border="0"></a></li>
<li><a href="version2.htm">Site <img src="moins.gif" border="0"></a></li>
<li><a href="faq.htm">F.A.Q. <img src="moins.gif" border="0"></a></li>
<li><a href="blog.htm">Remerciements <img src="moins.gif" border="0"></a></li>
<li><a href="#">Plan du Site <img src="moins.gif" border="0"></a></li>
<li><a href="#">NesS <img src="moins.gif" border="0"></a></li>
</ul>
</li>
<li class="closed" id="p6"><a href="#" onClick="P7_swapClass(1,'p6','open','closed','li');return false"><img src="plus.gif" border="0">
Liens</a>
<ul>
<li><a href="chat.htm">Lier LE&Ocirc; <img src="moins.gif" border="0"></a></li>
<li><a href="#">Mailing-List <img src="moins.gif" border="0"></a></li>
<li><a href="#">Romans en Ligne <img src="moins.gif" border="0"></a></li>
<li><a href="#">Sites d'Amis <img src="moins.gif" border="0"></a></li>
<li><a href="#">Divers <img src="moins.gif" border="0"></a></li>
</ul>
</li>
<li id="bas"></li>
</ul>
</div>


<div id="titrenews"></div>

<div id="newsbas"></div>
<div id="news">
<script src="scroller.js"></script>
</div>
<div id="frame">
<iframe id="iframe1" name="iframe1" width="100%" height="100%" frameborder="0" src="edito2.htm"></iframe>
</div>

<div id="version">
<a href="#" target="IFrame2" onmousedown="sTop=top.frames['iframe1'].document.getElementsByTagName('body')[0].scrollTop" onclick="switchCSS(1);return false">White</a>
<!-- <a href="versioncheck2.php?newskin=1" target="IFrame2" onmousedown="sTop=top.frames['iframe1'].document.getElementsByTagName('body')[0].scrollTop" onclick="switchCSS(1);">White</a> -->
<a href="#" target="IFrame2" onmousedown="sTop=top.frames['iframe1'].document.getElementsByTagName('body')[0].scrollTop" onclick="switchCSS(2);return false">Violet</a>
<!-- <a href="versioncheck2.php?newskin=2" target="IFrame2" onmousedown="sTop=top.frames['iframe1'].document.getElementsByTagName('body')[0].scrollTop" onclick="switchCSS(2);">Violet</a> -->
<a href="#" target="IFrame2" onmousedown="sTop=top.frames['iframe1'].document.getElementsByTagName('body')[0].scrollTop" onclick="switchCSS(3);return false">Orange</a>
<!-- <a href="versioncheck2.php?newskin=3" target="IFrame2" onmousedown="sTop=top.frames['iframe1'].document.getElementsByTagName('body')[0].scrollTop" onclick="switchCSS(3);">Orange</a> -->
<a href="#" target="IFrame2" onmousedown="sTop=top.frames['iframe1'].document.getElementsByTagName('body')[0].scrollTop" onclick="switchCSS(4);return false">Bleu</a>
<!-- <a href="versioncheck2.php?newskin=4" target="IFrame2" onmousedown="sTop=top.frames['iframe1'].document.getElementsByTagName('body')[0].scrollTop" onclick="switchCSS(4);">Bleu</a> -->
<a href="#" target="IFrame2" onmousedown="sTop=top.frames['iframe1'].document.getElementsByTagName('body')[0].scrollTop" onclick="switchCSS(5);return false">Vert</a>
<!-- <a href="versioncheck2.php?newskin=5" target="IFrame2" onmousedown="sTop=top.frames['iframe1'].document.getElementsByTagName('body')[0].scrollTop" onclick="switchCSS(5);">Vert</a> -->

</div>
<div id="versiontitre"></div>
<form name="urlForm" action="#">
<input type="hidden" name="cUrl" value="">
</form>

Ness_du_Frat
04-29-2005, 02:29 AM
the rest :

<script language="JavaScript" type="text/javascript">
<!--
var sTop;
var ns=(!document.all&&(navigator.vendor=='Netscape'||navigator.vendor=='Netscape6')&&!window.opera)
//window.onerror=function(e){if(ns)return true;}
//window.onerror=function(e){if(ns)alert(e);return true;}

function switchCSS(val){
var title="Mayi";
startcolor=new Array(255,255,255);
document.getElementById('pStyle').href='css'+val+'.css';
document.cookie='val='+val+';expires='+expiration+';path=/';
if (val==1)
{
strt='Mayi';
startcolor= new Array(255,255,255); // start color (red, green, blue)
endcolor=new Array(0,0,0); // end color (red, green, blue)
title='Mayi';
}
if (val==2)
{
strt='Asla';
startcolor= new Array(153,102,255); // start color (red, green, blue)
endcolor=new Array(0,0,0); // end color (red, green, blue)
title='Asla';

}
if (val==3)
{
strt='Okhanan';
startcolor= new Array(255,153,51); // start color (red, green, blue)
endcolor= new Array(0,0,0); // end color (red, green, blue)
title='Okhanan';
}
if (val==4)
{
strt='Isaac';
startcolor= new Array(102,102,255); // start color (red, green, blue)
endcolor=new Array(0,0,0); // end color (red, green, blue)
title='Isaac';
}
if (val==5)
{
strt='Lúka';
startcolor= new Array(153,255,153); // start color (red, green, blue)
endcolor=new Array(0,0,0); // end color (red, green, blue)
title='Lúka';
}
document.cookie="title="+title+"; expires="+expiration+";path=/";
document.cookie="startcolor_red="+startcolor[0]+"; expires="+expiration+";path=/";
document.cookie="startcolor_green="+startcolor[1]+"; expires="+expiration+";path=/";
document.cookie="startcolor_blue="+startcolor[2]+"; expires="+expiration+";path=/";
document.title="Les Enfants de l'Ô - version 3.0 - "+strt;

if(ns){
if(typeof(top.frames['iframe1'])=='object'){
document.getElementById('iframe1_1').src =document.urlForm.cUrl.value;
//alert(top.frames[0].document.getElementById('p1').nodeName)
top.frames[0].document.getElementById('cStyle').href='css'+val+'.css';
//document.getElementById('iframe1_1').document.getElementById('cStyle').href='css'+val+'.css';
}
}
else{
sTop+=0;
top.frames['iframe1'].document.getElementById('cStyle').href='http://psychomoa.free.fr/css'+val+'.css';
if(navigator.vendor=='Firefox'){
setTimeout("top.frames['iframe1'].window.scrollTo(0,"+sTop+")",250);
}
else{
top.window.frames['iframe1'].window.scrollTo(0,sTop)
}
}
top.window.frames['IFrame2'].location.href='versioncheck2.php?newskin='+val;
}
//-->
</script>
<iframe name='IFrame2' id='IFrame2' style="width:0;height:0;border:none;" frameborder="0"></iframe>
</body>
</html>

I don't think it's really necessary to post also the index.js and scroller.js codes, but I'll do it anyway, so that you have really everything...
index.js :

// JavaScript Document
function P7_swapClass(){ //v1.4 by PVII
var i,x,tB,j=0,tA=new Array(),arg=P7_swapClass.arguments;
if(document.getElementsByTagName){for(i=4;i<arg.length;i++){tB=document.getElementsByTagName(arg[i]);
for(x=0;x<tB.length;x++){tA[j]=tB[x];j++;}}for(i=0;i<tA.length;i++){
if(tA[i].className){if(tA[i].id==arg[1]){if(arg[0]==1){
tA[i].className=(tA[i].className==arg[3])?arg[2]:arg[3];}else{tA[i].className=arg[2];}
}else if(arg[0]==1 && arg[1]=='none'){if(tA[i].className==arg[2] || tA[i].className==arg[3]){
tA[i].className=(tA[i].className==arg[3])?arg[2]:arg[3];}
}else if(tA[i].className==arg[2]){tA[i].className=arg[3];}}}}
}

function MM_reloadPage(init) { //reloads the window if Nav4 resized
if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);

window.status = "Les Enfants de l'Ô- Copyright Vanessa du Frat";


scroller.js :

// JavaScript Document
/***********************************************
* Fading Scroller- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/

var delay = 2000; //set delay between message change (in miliseconds)
var maxsteps=30; // number of steps to take to change from start color to endcolor
var stepdelay=40; // time in miliseconds of a single step
//**Note: maxsteps*stepdelay will be total time in miliseconds of fading effect

var fcontent=new Array();
begintag='<div style="font: normal 12px Arial; padding: 10px; text-align: justify;">'; //set opening tag, such as font declarations
fcontent[0]="<b>Quoi de neuf ?</b><br>Bientôt la publication en ligne du <a href='http://lesangdesmiroirs.free.fr' target='_blank'>Sang des Miroirs</a>";
fcontent[1]="Nouveau design pour les <a href='http://enfantsdelo.free.fr' target='_blank'>Enfants de l'Ô</a>";
fcontent[2]="Bon, j'en ai marre d'écrire des messages de pub, moi ;)";
closetag='</div>';

var fwidth='170px'; //set scroller width
var fheight='80px'; //set scroller height

var fadelinks=1; //should links inside scroller content also fade like text? 0 for no, 1 for yes.

///No need to edit below this line/////////////////


var ie4=document.all&&!document.getElementById;
var DOM2=document.getElementById;
var faderdelay=0;
var index=0;


/*Rafael Raposo edited function*/
//function to change content
function changecontent(){
if (index>=fcontent.length)
index=0
if (DOM2){
document.getElementById("fscroller").style.color="rgb("+startcolor[0]+", "+startcolor[1]+", "+startcolor[2]+")"
document.getElementById("fscroller").innerHTML=begintag+fcontent[index]+closetag
if (fadelinks)
linkcolorchange(1);
colorfade(1, 15);
}
else if (ie4)
document.all.fscroller.innerHTML=begintag+fcontent[index]+closetag;
index++
}

// colorfade() partially by Marcio Galli for Netscape Communications. ////////////
// Modified by Dynamicdrive.com

function linkcolorchange(step){
var obj=document.getElementById("fscroller").getElementsByTagName("A");
if (obj.length>0){
for (i=0;i<obj.length;i++)
obj[i].style.color=getstepcolor(step);
}
}

/*Rafael Raposo edited function*/
var fadecounter;
function colorfade(step) {
if(step<=maxsteps) {
document.getElementById("fscroller").style.color=getstepcolor(step);
if (fadelinks)
linkcolorchange(step);
step++;
fadecounter=setTimeout("colorfade("+step+")",stepdelay);
}else{
clearTimeout(fadecounter);
document.getElementById("fscroller").style.color="rgb("+endcolor[0]+", "+endcolor[1]+", "+endcolor[2]+")";
setTimeout("changecontent()", delay);

}
}

/*Rafael Raposo's new function*/
function getstepcolor(step) {
var diff
var newcolor=new Array(3);
for(var i=0;i<3;i++) {
diff = (startcolor[i]-endcolor[i]);
if(diff > 0) {
newcolor[i] = startcolor[i]-(Math.round((diff/maxsteps))*step);
} else {
newcolor[i] = startcolor[i]+(Math.round((Math.abs(diff)/maxsteps))*step);
}
}
return ("rgb(" + newcolor[0] + ", " + newcolor[1] + ", " + newcolor[2] + ")");
}

if (ie4||DOM2)
document.write('<div id="fscroller" width:'+fwidth+';height:'+fheight+'"></div>');

if (window.addEventListener)
window.addEventListener("load", changecontent, false)
else if (window.attachEvent)
window.attachEvent("onload", changecontent)
else if (document.getElementById)
window.onload=changecontent

Ness_du_Frat
04-29-2005, 02:30 AM
finally, that's edito.htm, the page in the iframe, on which the glitch occurs :

<?xml version="1.0" encoding="iso-8859-1"?>
<!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>
<title>Edito</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript">

function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) { // if the cookie exists
offset += search.length
end = document.cookie.indexOf(";", offset); // set the index of beginning value

if (end == -1) // set the index of the end of cookie value
end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}

if(get_cookie('val')!==""){
document.write('<LINK REL=stylesheet id="cStyle" HREF="css'+get_cookie('val')+'.css" TYPE="text/css">');
}else{
document.write('<LINK REL=stylesheet id="cStyle" HREF="css1.css" TYPE="text/css">');
}

</script>
</head>

<body>
<div id="edito"></div>
<br>
<br>
<br>
<h2>23 F&eacute;vrier 2005</h2>
<p>some blabla</p>
<p>Psycho / Ness </p>
</body>

</html>

scragar
04-29-2005, 05:38 AM
If I remember correctly that's an IE error(it fails to recive all it's info and go's crazy), the solution is to just scroll down, then back up the page.

This could easily be acomplished using javascript like all your cookies are if you set two acnhors(scroll down then up immediatly so the user doesn't notice), of course the frame would have to be large enough to have the scroll or things won't work...

buntine
04-29-2005, 05:51 AM
This could easily be acomplished using javascript like all your cookies are if you set two acnhors(scroll down then up immediatly so the user doesn't notice), of course the frame would have to be large enough to have the scroll or things won't work...

Sounds like a bit of a workaround hack.

I am interested in seeing the actual problem occur. Is there any way you can upload the files to a server so we can see if we can reproduce the problem on our machines?

Regards.

Ness_du_Frat
04-29-2005, 06:04 AM
oh, it's even simpler...
just go here :
Website (http://psychomoa.free.fr/accueiltestcookie2.php)
Actually, it's occuring only in IE, as you said. i know about the scrolling up and down, but... if there was another way to avoid it, it could be nice :)

buntine
04-29-2005, 06:33 AM
Works fine for me.

scragar
04-29-2005, 06:36 AM
and me strangly enough.

then again it might just be a matter of trying again(no don't just refresh it. clear your cache first).

Ness_du_Frat
04-29-2005, 06:59 AM
yeah, for me it works fine also, but I tried on different computers, and on the first time, it ALWAYS does the glitch...
I mean, it's not sooo important, most of the people will think something is wrong with their graphic card and get crazy, but... lol !!! If you refresh, the page goes back to normal.
I'm just wondering : why is that ???

scragar
04-29-2005, 07:03 AM
I've told you, IE doesn't process things all at once, it considers things as rows(about 8px a time in horrizontal rows), the problem occurs when by the use of css IE puts a bad row in(that's blank, or blank at a particular point), but the row bellow it has the right info. You wind up with part to the text missing. By scrolling down or reloading the page you tell IE to try again, and it should get it's lines right.

Ness_du_Frat
04-29-2005, 03:08 PM
I was mostly wondering if that was because I had javascript errors on the page ? What do you think, scragar ?

scragar
04-30-2005, 06:11 AM
It's the CSS that causes the problems, not javascript.

I remember reading about it in an MSDN blog, stupid people adding bugs to great things...