XCocoman
11-11-2003, 11:57 AM
Hi All,
I am trying to use the script for a PHP integrated website whereby, I am having HEADER and FOOTER for all pages. But the problem is I am already having two other Javascripts in the HEADER so, somehow I am having problem getting the script to work. When I tried to get all the three javascripts to work, the JS menu buttons refused to load properly. Below you will find how both IE and Netscape react towards the script.
Could somebody help me solve this conflict. This seems to be onLoad function handler problem but I don't know how to go about it. Or browser compatibility problem.
Something very interesting is happening and I don't know how to go about it. Below script shows the the two different reaction of both IE and Netscape.
Both IE and Netscape used to load successfull without the Random Table Backgroung Image Rotater. This problem startd when I added the Random Table BG Image Rotater that's why I am including this script also.
RED : This is how Netscape loads the menu buttons successfully.
BLUE : This is how IE loads the menu buttons successfully.
Script 1: JS Menu Buttons
var clicked=""
var gtype=".gif"
var selstate="_over"
if (typeof(loc)=="undefined" || loc==""){
var loc=""
if (document.body&&document.body.innerHTML){
var tt = document.body.innerHTML.toLowerCase();
var last = tt.indexOf("menu_button.js\"");
if (last>0){
var first = tt.lastIndexOf("\"", last);
if (first>0 && first<last) loc = document.body.innerHTML.substr(first+1,last-first-1);
}
}
}
document.write("<table border=\"0\" cellspacing=\"0\" cellpadding=\"0\"><tr>");
tr(false);
writeButton("","index.php?page=index","images/menu_button_b1",96,37,"home","",0);
writeButton("","index.php?page=register","images/menu_button_b2",96,37,"register for free","",0);
writeButton("","index.php?page=sign_in","images/menu_button_b3",96,37,"members login","",0);
writeButton("","index.php?page=search","images/menu_button_b4",96,37,"search for match","",0);
writeButton("","index.php?page=browse","menu_button_b5",96,37,"browse","",0);
writeButton("","index.php?page=faq","menu_button_b6",96,37,"information","",0);
writeButton("","index.php?page=faq","menu_button_b7",96,37,"help and dating tips","",0);
writeButton("","mailto:<? echo $admin_mail ?>","menu_button_b8",96,37,"contact","",0); tr(true);
document.write("</tr></table>")
loc="";
function tr(b){}
function turn_over(name) {
if (document.images != null && clicked != name) {
document[name].src = document[name+"_over"].src;
}
}
function turn_off(name) {
if (document.images != null && clicked != name) {
document[name].src = document[name+"_off"].src;
}
}
function reg(gname,name)
{
if (document.images)
{
document[name+"_off"] = new Image();
document[name+"_off"].src = loc+gname+gtype;
document[name+"_over"] = new Image();
document[name+"_over"].src = loc+gname+"_over"+gtype;
}
}
function evs(name){ return " onmouseover=\"turn_over('"+ name + "')\" onmouseout=\"turn_off('"+ name + "')\""}
function writeButton(urld, url, name, w, h, alt, target, hsp)
{
gname = name;
while(typeof(document[name])!="undefined") name += "x";
reg(gname, name);
tr(true);
document.write("<td>");
if (alt != "") alt = " alt=\"" + alt + "\"";
if (target != "") target = " target=\"" + target + "\"";
if (w > 0) w = " width=\""+w+"\""; else w = "";
if (h > 0) h = " height=\""+h+"\""; else h = "";
if (url != "") url = " href=\"" + urld + url + "\"";
document.write("<a " + url + evs(name) + target + ">");
if (hsp == -1) hsp =" align=\"right\"";
else if (hsp > 0) hsp = " hspace=\""+hsp+"\"";
else hsp = "";
document.write("<img src=\""+loc+gname+gtype+"\" name=\"" + name + "\"" + w + h + alt + hsp + " border=\"0\" /></a></td>");
tr(false);
}
======================================================
And here is the script I added when the problem started.
======================================================
Script 2: JS Random Table Backgroung Image Rotater
<script type="text/javascript" language="javascript">
<!--
var img_urls = [
'js_imageslide/bg_image001.jpg' ,
'js_imageslide/bg_image002.jpg' ,
'js_imageslide/bg_image003.jpg' ,
'js_imageslide/bg_image004.jpg' ,
'js_imageslide/bg_image005.jpg' ,
'js_imageslide/bg_image006.jpg' ,
'js_imageslide/bg_image007.jpg' ,
'js_imageslide/bg_image008.jpg' ,
'js_imageslide/bg_image009.jpg' ,
'js_imageslide/bg_image0010.jpg' ,
'js_imageslide/bg_image0011.jpg' ,
'js_imageslide/bg_image0012.jpg'
];
var idx_array, idx_str, obj;
if (!/__RANDOM_BG_IMAGE_ROTATOR__/.test(self.name))
{
var idx, i, ind1, ind2, temp, arraylength = img_urls.length;
idx_array = new Array(arraylength);
for (i = 0; i < arraylength; ++i) idx_array[i] = i;
for (i = 0; i < arraylength; ++i)
{
ind1 = Math.floor(Math.random() * arraylength);
ind2 = Math.floor(Math.random() * arraylength);
temp = idx_array[ind1];
idx_array[ind1] = idx_array[ind2];
idx_array[ind2] = temp;
}
idx_str = idx_array.join(',');
}
else
{
idx_str = self.name.split('__RANDOM_BG_IMAGE_ROTATOR__')[1];
}
idx_array = idx_str.split(',');
var first_idx = idx_array.splice(0,1);
var TABLE_background = img_urls[first_idx];
idx_array[idx_array.length] = first_idx;
idx_str = idx_array.join(',');
self.name = '__RANDOM_BG_IMAGE_ROTATOR__' + idx_str;
obj = new Image();
obj.src = img_urls[idx_array[0]];
onload = function()
{
document.getElementById('imageslider').style.backgroundImage = 'url(' + TABLE_background + ')';
}
//-->
</script>
Thanks in advance.
XCocoman.
I am trying to use the script for a PHP integrated website whereby, I am having HEADER and FOOTER for all pages. But the problem is I am already having two other Javascripts in the HEADER so, somehow I am having problem getting the script to work. When I tried to get all the three javascripts to work, the JS menu buttons refused to load properly. Below you will find how both IE and Netscape react towards the script.
Could somebody help me solve this conflict. This seems to be onLoad function handler problem but I don't know how to go about it. Or browser compatibility problem.
Something very interesting is happening and I don't know how to go about it. Below script shows the the two different reaction of both IE and Netscape.
Both IE and Netscape used to load successfull without the Random Table Backgroung Image Rotater. This problem startd when I added the Random Table BG Image Rotater that's why I am including this script also.
RED : This is how Netscape loads the menu buttons successfully.
BLUE : This is how IE loads the menu buttons successfully.
Script 1: JS Menu Buttons
var clicked=""
var gtype=".gif"
var selstate="_over"
if (typeof(loc)=="undefined" || loc==""){
var loc=""
if (document.body&&document.body.innerHTML){
var tt = document.body.innerHTML.toLowerCase();
var last = tt.indexOf("menu_button.js\"");
if (last>0){
var first = tt.lastIndexOf("\"", last);
if (first>0 && first<last) loc = document.body.innerHTML.substr(first+1,last-first-1);
}
}
}
document.write("<table border=\"0\" cellspacing=\"0\" cellpadding=\"0\"><tr>");
tr(false);
writeButton("","index.php?page=index","images/menu_button_b1",96,37,"home","",0);
writeButton("","index.php?page=register","images/menu_button_b2",96,37,"register for free","",0);
writeButton("","index.php?page=sign_in","images/menu_button_b3",96,37,"members login","",0);
writeButton("","index.php?page=search","images/menu_button_b4",96,37,"search for match","",0);
writeButton("","index.php?page=browse","menu_button_b5",96,37,"browse","",0);
writeButton("","index.php?page=faq","menu_button_b6",96,37,"information","",0);
writeButton("","index.php?page=faq","menu_button_b7",96,37,"help and dating tips","",0);
writeButton("","mailto:<? echo $admin_mail ?>","menu_button_b8",96,37,"contact","",0); tr(true);
document.write("</tr></table>")
loc="";
function tr(b){}
function turn_over(name) {
if (document.images != null && clicked != name) {
document[name].src = document[name+"_over"].src;
}
}
function turn_off(name) {
if (document.images != null && clicked != name) {
document[name].src = document[name+"_off"].src;
}
}
function reg(gname,name)
{
if (document.images)
{
document[name+"_off"] = new Image();
document[name+"_off"].src = loc+gname+gtype;
document[name+"_over"] = new Image();
document[name+"_over"].src = loc+gname+"_over"+gtype;
}
}
function evs(name){ return " onmouseover=\"turn_over('"+ name + "')\" onmouseout=\"turn_off('"+ name + "')\""}
function writeButton(urld, url, name, w, h, alt, target, hsp)
{
gname = name;
while(typeof(document[name])!="undefined") name += "x";
reg(gname, name);
tr(true);
document.write("<td>");
if (alt != "") alt = " alt=\"" + alt + "\"";
if (target != "") target = " target=\"" + target + "\"";
if (w > 0) w = " width=\""+w+"\""; else w = "";
if (h > 0) h = " height=\""+h+"\""; else h = "";
if (url != "") url = " href=\"" + urld + url + "\"";
document.write("<a " + url + evs(name) + target + ">");
if (hsp == -1) hsp =" align=\"right\"";
else if (hsp > 0) hsp = " hspace=\""+hsp+"\"";
else hsp = "";
document.write("<img src=\""+loc+gname+gtype+"\" name=\"" + name + "\"" + w + h + alt + hsp + " border=\"0\" /></a></td>");
tr(false);
}
======================================================
And here is the script I added when the problem started.
======================================================
Script 2: JS Random Table Backgroung Image Rotater
<script type="text/javascript" language="javascript">
<!--
var img_urls = [
'js_imageslide/bg_image001.jpg' ,
'js_imageslide/bg_image002.jpg' ,
'js_imageslide/bg_image003.jpg' ,
'js_imageslide/bg_image004.jpg' ,
'js_imageslide/bg_image005.jpg' ,
'js_imageslide/bg_image006.jpg' ,
'js_imageslide/bg_image007.jpg' ,
'js_imageslide/bg_image008.jpg' ,
'js_imageslide/bg_image009.jpg' ,
'js_imageslide/bg_image0010.jpg' ,
'js_imageslide/bg_image0011.jpg' ,
'js_imageslide/bg_image0012.jpg'
];
var idx_array, idx_str, obj;
if (!/__RANDOM_BG_IMAGE_ROTATOR__/.test(self.name))
{
var idx, i, ind1, ind2, temp, arraylength = img_urls.length;
idx_array = new Array(arraylength);
for (i = 0; i < arraylength; ++i) idx_array[i] = i;
for (i = 0; i < arraylength; ++i)
{
ind1 = Math.floor(Math.random() * arraylength);
ind2 = Math.floor(Math.random() * arraylength);
temp = idx_array[ind1];
idx_array[ind1] = idx_array[ind2];
idx_array[ind2] = temp;
}
idx_str = idx_array.join(',');
}
else
{
idx_str = self.name.split('__RANDOM_BG_IMAGE_ROTATOR__')[1];
}
idx_array = idx_str.split(',');
var first_idx = idx_array.splice(0,1);
var TABLE_background = img_urls[first_idx];
idx_array[idx_array.length] = first_idx;
idx_str = idx_array.join(',');
self.name = '__RANDOM_BG_IMAGE_ROTATOR__' + idx_str;
obj = new Image();
obj.src = img_urls[idx_array[0]];
onload = function()
{
document.getElementById('imageslider').style.backgroundImage = 'url(' + TABLE_background + ')';
}
//-->
</script>
Thanks in advance.
XCocoman.