Salve, mi trovo con l’ennesimo problema del conflitto di due script che fanno uso di javascript mediante “OnLoad” e in alcuni casi di “OnUnload” all’interno della stessa pagina o cmq nel body!
Si tratta uno, del famoso script NiftCorners che mi permette di avere dei box con gli angoli arrotondati utilizzando Javascript in accoppiata dei css, l’altro Sylesheets sempre in javascript e css mi permette di selezionare un diverso layout al sito mantenendo quello selezionato anche per i successivi accessi!
Per venirmi incontro vi posto il codice per poter meglio risolvere il problema.
Per ognuno di essi vengono richiamati gli script dall’esterno e si compongono dei seguenti file e codice:
Script: NiftCorners
Codice Nift.js:
function NiftyCheck(){
if(!document.getElementById || !document.createElement)
return(false);
var b=navigator.userAgent.toLowerCase();
if(b.indexOf("msie 5")>0 && b.indexOf("opera")==-1)
return(false);
return(true);
}
function Rounded(selector,bk,color,size){
var i;
var v=getElementsBySelector(selector);
var l=v.length;
for(i=0;i<l;i++){
AddTop(v[i],bk,color,size);
AddBottom(v[i],bk,color,size);
}
}
function RoundedTop(selector,bk,color,size){
var i;
var v=getElementsBySelector(selector);
for(i=0;i<v.length;i++)
AddTop(v[i],bk,color,size);
}
function RoundedBottom(selector,bk,color,size){
var i;
var v=getElementsBySelector(selector);
for(i=0;i<v.length;i++)
AddBottom(v[i],bk,color,size);
}
function AddTop(el,bk,color,size){
var i;
var d=document.createElement("b");
var cn="r";
var lim=4;
if(size && size=="small"){ cn="rs"; lim=2}
d.className="rtop";
d.style.backgroundColor=bk;
for(i=1;i<=lim;i++){
var x=document.createElement("b");
x.className=cn + i;
x.style.backgroundColor=color;
d.appendChild(x);
}
el.insertBefore(d,el.firstChild);
}
function AddBottom(el,bk,color,size){
var i;
var d=document.createElement("b");
var cn="r";
var lim=4;
if(size && size=="small"){ cn="rs"; lim=2}
d.className="rbottom";
d.style.backgroundColor=bk;
for(i=lim;i>0;i--){
var x=document.createElement("b");
x.className=cn + i;
x.style.backgroundColor=color;
d.appendChild(x);
}
el.appendChild(d,el.firstChild);
}
function getElementsBySelector(selector){
var i;
var s=[];
var selid="";
var selclass="";
var tag=selector;
var objlist=[];
if(selector.indexOf(" ")>0){ //descendant selector like "tag#id tag"
s=selector.split(" ");
var fs=s[0].split("#");
if(fs.length==1) return(objlist);
return(document.getElementById(fs[1]).getElementsByTagName(s[1]));
}
if(selector.indexOf("#")>0){ //id selector like "tag#id"
s=selector.split("#");
tag=s[0];
selid=s[1];
}
if(selid!=""){
objlist.push(document.getElementById(selid));
return(objlist);
}
if(selector.indexOf(".")>0){ //class selector like "tag.class"
s=selector.split(".");
tag=s[0];
selclass=s[1];
}
var v=document.getElementsByTagName(tag); // tag selector like "tag"
if(selclass=="")
return(v);
for(i=0;i<v.length;i++){
if(v[i].className==selclass){
objlist.push(v[i]);
}
}
return(objlist);
}
Codice Layout.js:
window.onload=function(){
if(!NiftyCheck())
return;
RoundedTop("div.contenuto","#F0F0F0","#E7E7E7");
RoundedBottom("div.contenuto","#F0F0F0","#E7E7E7") ;
RoundedTop("div.box1dx","#F0F0F0","#999999","small ");
RoundedBottom("div.box1dx","#F0F0F0","#CCCCCC","sm all");
RoundedTop("div.box2dx","#F0F0F0","#999999","small ");
RoundedBottom("div.box2dx","#F0F0F0","#CCCCCC","sm all");
RoundedTop("div.box3dx","#F0F0F0","#999999","small ");
RoundedBottom("div.box3dx","#F0F0F0","#E7E7E7","sm all");
RoundedTop("div.box4dx","#F0F0F0","#999999","small ");
RoundedBottom("div.box4dx","#F0F0F0","#CCFF66","sm all");
RoundedTop("div.box1sx","#F0F0F0","#999999","small ");
RoundedBottom("div.box1sx","#F0F0F0","#E5ECF9","sm all");
RoundedTop("div.box2sx","#F0F0F0","#999999","small ");
RoundedBottom("div.box2sx","#F0F0F0","#E5ECF9","sm all");
RoundedTop("div.box3sx","#F0F0F0","#999999","small ");
RoundedBottom("div.box3sx","#F0F0F0","#E5ECF9","sm all");
RoundedTop("div.box4sx","#F0F0F0","#999999","small ");
RoundedBottom("div.box4sx","#F0F0F0","#E5ECF9","sm all");
RoundedTop("div.box5sx","#F0F0F0","#999999","small ");
RoundedBottom("div.box5sx","#F0F0F0","#CCFF66","sm all");
RoundedTop("div.boxinfo","#F0F0F0","#CCCCCC","smal l");
RoundedBottom("div.boxinfo","#F0F0F0","#CCCCCC","s mall");
Rounded("div#formg","#E7E7E7","#CCCCCC");
Rounded("div#formc","#E7E7E7","#CCCCCC");
Rounded("label","#CCCCCC","#F0F0F0","small");
RoundedBottom("div#footer","#A6A4A6","#E5ECF9","5" );
}
Oltre a questi due naturalmente vi è anche il css che non ha importanza in questa sede!
L’altro…
Script Sylesheets
Codice SyleSwap:
// JavaScript Document
//function changeSheet performs the style swap when given a title
function changeSheet(theSheet) {
if(document.styleSheets){
var c = document.styleSheets.length;
for(var i=0;i<c;i++){
if(document.styleSheets[i].title!=theSheet){
document.styleSheets[i].disabled=true;
}else{
document.styleSheets[i].disabled=false;
}
}
}
}
Quest’ultimo inoltre viene richiamato nel body in questo modo:
<body onload= "pageLoad()" onUnload="applyChange()">
ed è quello che funziona non facendo vedere gli angoli arrotondati…Quindi va in conflitto!!
Come risolvere??
Per un riferimento potete vederlo all’indirizzo http://www.medief.com.
Spero di essere stato chiaro,Grazie per la collaborazione.