/    Sign up×
Community /Pin to ProfileBookmark

strangest thing…

Copy linkTweet thisAlerts:
Apr 28.2005

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 )
[URL=http://psychomoa.free.fr/test.gif]screenshot[/URL]
I’ll post the code if necessary…
As somebody already encountered this kind of issue ? it never happened to me before… ?
thanks for any suggestions !!!

to post a comment
Full-stack Developer

14 Comments(s) ↴

Copy linkTweet thisAlerts:
@buntineApr 29.2005 — Looks like a design issue. Yeah, post some code.

Regards.
Copy linkTweet thisAlerts:
@ray326Apr 29.2005 — Wow, that black on black doesn't do much for me.
Copy linkTweet thisAlerts:
@Ness_du_FratauthorApr 29.2005 — I have to warn you, the code is.... you'll see ?
[code=php]
<!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>
[/code]
Copy linkTweet thisAlerts:
@Ness_du_FratauthorApr 29.2005 — the rest :
[code=php]
<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>
[/code]
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 :
[code=php]
// 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";
[/code]

scroller.js :
[code=php]
// 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
[/code]
Copy linkTweet thisAlerts:
@Ness_du_FratauthorApr 29.2005 — finally, that's edito.htm, the page in the iframe, on which the glitch occurs :
[code=php]
<?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>
[/code]
Copy linkTweet thisAlerts:
@scragarApr 29.2005 — 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...
Copy linkTweet thisAlerts:
@buntineApr 29.2005 — 
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...
[/quote]
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.
Copy linkTweet thisAlerts:
@Ness_du_FratauthorApr 29.2005 — oh, it's even simpler...

just go here :

[URL=http://psychomoa.free.fr/accueiltestcookie2.php]Website[/URL]

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 ?
Copy linkTweet thisAlerts:
@buntineApr 29.2005 — Works fine for me.
Copy linkTweet thisAlerts:
@scragarApr 29.2005 — 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).
Copy linkTweet thisAlerts:
@Ness_du_FratauthorApr 29.2005 — 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 ???
Copy linkTweet thisAlerts:
@scragarApr 29.2005 — 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.
Copy linkTweet thisAlerts:
@Ness_du_FratauthorApr 29.2005 — I was mostly wondering if that was because I had javascript errors on the page ? What do you think, scragar ?
Copy linkTweet thisAlerts:
@scragarApr 30.2005 — 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...
×

Success!

Help @Ness_du_Frat spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...