Post by SubDevo on Mar 10, 2010 4:58:43 GMT -8
NewsFader Customize by SubDevo
Tested in IE, FF, Opera, Safari and Chrome
This code does just about anything you want to do with the default ProBoards Newsfader!
they will automatically attach your head and base images to the NewsFader!
NOTE:
There are two versions for this code. The first is described above. The second version is exactly the same code with the addition of Head and Base images. It is at the bottom of this post.
Choose the version that suits your needs.
Read THIS (reply #2) to further Customize your NewsFader!
Enjoy!!!
SubDevo
Variables: Edit the Maroon portions.
var nHide=0; // Hide Newsfader From Guests? 1=Yes, 0=No
Set this to "1" if you wish to hide your NewsFader from guests.
var nTitle="News"; // News Fader Title
If you set it to empty "", it will completely remove the title bar!
Enter the text or HTML for the title of your NewsFader.
For an image use: <img src='URL TO IMAGE' />
To style your title, use span or font. Example: (change font size to 14px and make it Red)
<span style='font-size:14px; color:#FF0000;'>NEWS TITLE</span>
var nHeight="60px"; // Height
var nWidth="778px"; // Width
Set your required height and width here. You may use a percentage for the width if your forum is not fixed width (PB default is 92%). If you are using head/base image code, set this to the width of your head/base images.
var nClass="windowbg"; // Class Name
Set the class name here to style the background of the newsfader. You could make your own class and put the name here. Give your newsfader a background image or color and/or borders with this!
var fStyle="color: #000000; font-family: Arial; font-size: 24px; font-weight: bold;"; // CSS style for text
This is the style of your text. Use normal CSS properties here.
var aboveNav=1; // Move Above the Nav Tree? 1=Yes, 0=No
Set this to "1" to separate the NewsFader and move it above your nav tree.
PB default is below the nav tree.
var sTop=25; // Top Space (not used if aboveNav=0)
If you set aboveNav to "1" this is the space above the NewsFader.
var sBot=25; // Bottom Space
This is the space below the NewsFader.
Location: Main Footer
<script type="text/javascript">
<!--
/* NewsFader Customize by SubDevo */
/* Main Footer - Please leave this header intact. Do not repost. */
/* interoceandesigns.proboards.com or lsdp.proboards.com */
var nHide=0; // Hide Newsfader From Guests? 1=Yes, 0=No
var nTitle="News"; // News Fader Title
var nHeight="60px"; // Height
var nWidth="778px"; // Width
var nClass="windowbg"; // Background Class Name
var fStyle="color: #000000; font-family: Arial; font-size: 24px; font-weight: bold;"; // CSS style for text
var aboveNav=1; // Move Above the Nav Tree? 1=Yes, 0=No
var sTop=25; // Top Space (not used if aboveNav=0)
var sBot=25; // Bottom Space
var nF=document.getElementById("fscroller");
if(nF){ var tB=pNo(nF,2).previousSibling; var tC=tB.firstChild; nF.style.cssText=fStyle;
if(nTitle){tC.innerHTML=tC.innerHTML.replace(/News/,nTitle)}else{tB.style.display="none";}
with(nF.parentNode){className=nClass; height=nHeight;} var nT=pNo(nF,8);
nT.style.width=nWidth; nT.id="newN"; nT.align="center"; var nTb=pNo(nT,4);
if(aboveNav){if(sTop){dtb(nTb,mD(sTop));}dtb(nTb,nT);}
if(sBot){dtb((aboveNav)?nTb:nT.nextSibling,mD(sBot));}
if(nHide&&pb_username=="Guest"){document.getElementById("newN").style.display="none";}
} function pNo(a,n){for(var x=0;x<n;x++){a=a.parentNode;} return a;}
function mD(a){var n=document.createElement("div");n.style.height=a+"px";return n;}
function dtb(a,b){a.parentNode.insertBefore(b,a);}
//-->
</script>
NewsFader Customize with H/B Images
Use this code, if you want Head and Base images and are NOT using a "head/base images everywhere" code.
<script type="text/javascript">
<!--
/* NewsFader Customize with H/B Images by SubDevo */
/* Main Footer - Please leave this header intact. Do not repost. */
/* interoceandesigns.proboards.com or lsdp.proboards.com */
var head="URL TO IMAGE"; // URL to Head Image
var base="URL TO IMAGE"; // URL to Base Image
var nHide=0; // Hide Newsfader From Guests? 1=Yes, 0=No
var nTitle="News"; // News Fader Title
var nHeight="60px"; // Height
var nWidth="778px"; // Width
var nClass="windowbg"; // Background Class Name
var fStyle="color: #000000; font-family: Arial; font-size: 24px; font-weight: bold;"; // CSS style for text
var aboveNav=1; // Move Above the Nav Tree? 1=Yes, 0=No
var sTop=25; // Top Space (not used if aboveNav=0)
var sBot=25; // Bottom Space
var nF=document.getElementById("fscroller");
if(nF){ var tB=pNo(nF,2).previousSibling; var tC=tB.firstChild; nF.style.cssText=fStyle;
if(nTitle){tC.innerHTML=tC.innerHTML.replace(/News/,nTitle)}else{tB.style.display="none";}
with(nF.parentNode){className=nClass; height=nHeight;} var nT=pNo(nF,8);
nT.style.width=nWidth; nT.id="newN"; nT.align="center"; var nTb=pNo(nT,4);
if(aboveNav){if(sTop){dtb(nTb,mD(sTop));}dtb(nTb,nT);}
if(sBot){dtb((aboveNav)?nTb:nT.nextSibling,mD(sBot));}
var nFad=document.getElementById("newN");
if(nHide&&pb_username=="Guest"){nFad.style.display="none";}
else{mDiv(head,nFad); mDiv(base,nFad.nextSibling);}
} function pNo(a,n){for(var x=0;x<n;x++){a=a.parentNode;} return a;}
function mD(a){var n=document.createElement("div");n.style.height=a+"px";return n;}
function dtb(a,b){a.parentNode.insertBefore(b,a);}
function mDiv(dSrc,a){ if(!dSrc.match(/^http:\/\//i)){return;}
var nD=document.createElement("div");
with(nD){align="center"; innerHTML='<img src="'+dSrc+'" />';}
a.parentNode.insertBefore(nD,a);
}
//-->
</script>
Tested in IE, FF, Opera, Safari and Chrome
This code does just about anything you want to do with the default ProBoards Newsfader!
- Change the "News" title or remove it.
- Hide the NewsFader from Guests.
- Custom Height and Width.
- Change the default color, size and style of your text.
- Change the background as you wish, with your own class.
- Detach and move above your nav tree with adjustable spacer above and below.
or keep in default position (under nav tree) with adjustable bottom spacer. - No Loops! Small, fast code.
they will automatically attach your head and base images to the NewsFader!
NOTE:
There are two versions for this code. The first is described above. The second version is exactly the same code with the addition of Head and Base images. It is at the bottom of this post.
Choose the version that suits your needs.
Read THIS (reply #2) to further Customize your NewsFader!
Enjoy!!!
SubDevo
Variables: Edit the Maroon portions.
var nHide=0; // Hide Newsfader From Guests? 1=Yes, 0=No
Set this to "1" if you wish to hide your NewsFader from guests.
var nTitle="News"; // News Fader Title
If you set it to empty "", it will completely remove the title bar!
Enter the text or HTML for the title of your NewsFader.
For an image use: <img src='URL TO IMAGE' />
To style your title, use span or font. Example: (change font size to 14px and make it Red)
<span style='font-size:14px; color:#FF0000;'>NEWS TITLE</span>
var nHeight="60px"; // Height
var nWidth="778px"; // Width
Set your required height and width here. You may use a percentage for the width if your forum is not fixed width (PB default is 92%). If you are using head/base image code, set this to the width of your head/base images.
var nClass="windowbg"; // Class Name
Set the class name here to style the background of the newsfader. You could make your own class and put the name here. Give your newsfader a background image or color and/or borders with this!
var fStyle="color: #000000; font-family: Arial; font-size: 24px; font-weight: bold;"; // CSS style for text
This is the style of your text. Use normal CSS properties here.
var aboveNav=1; // Move Above the Nav Tree? 1=Yes, 0=No
Set this to "1" to separate the NewsFader and move it above your nav tree.
PB default is below the nav tree.
var sTop=25; // Top Space (not used if aboveNav=0)
If you set aboveNav to "1" this is the space above the NewsFader.
var sBot=25; // Bottom Space
This is the space below the NewsFader.
Location: Main Footer
<script type="text/javascript">
<!--
/* NewsFader Customize by SubDevo */
/* Main Footer - Please leave this header intact. Do not repost. */
/* interoceandesigns.proboards.com or lsdp.proboards.com */
var nHide=0; // Hide Newsfader From Guests? 1=Yes, 0=No
var nTitle="News"; // News Fader Title
var nHeight="60px"; // Height
var nWidth="778px"; // Width
var nClass="windowbg"; // Background Class Name
var fStyle="color: #000000; font-family: Arial; font-size: 24px; font-weight: bold;"; // CSS style for text
var aboveNav=1; // Move Above the Nav Tree? 1=Yes, 0=No
var sTop=25; // Top Space (not used if aboveNav=0)
var sBot=25; // Bottom Space
var nF=document.getElementById("fscroller");
if(nF){ var tB=pNo(nF,2).previousSibling; var tC=tB.firstChild; nF.style.cssText=fStyle;
if(nTitle){tC.innerHTML=tC.innerHTML.replace(/News/,nTitle)}else{tB.style.display="none";}
with(nF.parentNode){className=nClass; height=nHeight;} var nT=pNo(nF,8);
nT.style.width=nWidth; nT.id="newN"; nT.align="center"; var nTb=pNo(nT,4);
if(aboveNav){if(sTop){dtb(nTb,mD(sTop));}dtb(nTb,nT);}
if(sBot){dtb((aboveNav)?nTb:nT.nextSibling,mD(sBot));}
if(nHide&&pb_username=="Guest"){document.getElementById("newN").style.display="none";}
} function pNo(a,n){for(var x=0;x<n;x++){a=a.parentNode;} return a;}
function mD(a){var n=document.createElement("div");n.style.height=a+"px";return n;}
function dtb(a,b){a.parentNode.insertBefore(b,a);}
//-->
</script>
NewsFader Customize with H/B Images
Use this code, if you want Head and Base images and are NOT using a "head/base images everywhere" code.
<script type="text/javascript">
<!--
/* NewsFader Customize with H/B Images by SubDevo */
/* Main Footer - Please leave this header intact. Do not repost. */
/* interoceandesigns.proboards.com or lsdp.proboards.com */
var head="URL TO IMAGE"; // URL to Head Image
var base="URL TO IMAGE"; // URL to Base Image
var nHide=0; // Hide Newsfader From Guests? 1=Yes, 0=No
var nTitle="News"; // News Fader Title
var nHeight="60px"; // Height
var nWidth="778px"; // Width
var nClass="windowbg"; // Background Class Name
var fStyle="color: #000000; font-family: Arial; font-size: 24px; font-weight: bold;"; // CSS style for text
var aboveNav=1; // Move Above the Nav Tree? 1=Yes, 0=No
var sTop=25; // Top Space (not used if aboveNav=0)
var sBot=25; // Bottom Space
var nF=document.getElementById("fscroller");
if(nF){ var tB=pNo(nF,2).previousSibling; var tC=tB.firstChild; nF.style.cssText=fStyle;
if(nTitle){tC.innerHTML=tC.innerHTML.replace(/News/,nTitle)}else{tB.style.display="none";}
with(nF.parentNode){className=nClass; height=nHeight;} var nT=pNo(nF,8);
nT.style.width=nWidth; nT.id="newN"; nT.align="center"; var nTb=pNo(nT,4);
if(aboveNav){if(sTop){dtb(nTb,mD(sTop));}dtb(nTb,nT);}
if(sBot){dtb((aboveNav)?nTb:nT.nextSibling,mD(sBot));}
var nFad=document.getElementById("newN");
if(nHide&&pb_username=="Guest"){nFad.style.display="none";}
else{mDiv(head,nFad); mDiv(base,nFad.nextSibling);}
} function pNo(a,n){for(var x=0;x<n;x++){a=a.parentNode;} return a;}
function mD(a){var n=document.createElement("div");n.style.height=a+"px";return n;}
function dtb(a,b){a.parentNode.insertBefore(b,a);}
function mDiv(dSrc,a){ if(!dSrc.match(/^http:\/\//i)){return;}
var nD=document.createElement("div");
with(nD){align="center"; innerHTML='<img src="'+dSrc+'" />';}
a.parentNode.insertBefore(nD,a);
}
//-->
</script>