<< [戀花]Blog樂多樣板 - 三欄1024x768 | 回blog首頁 | 利用SQL直接算出目前日期差距(DATEDIFF) >>

November 21,2007

IE & Firefox 都可使用的輪撥選單

製做類似 Yahoo的輪撥式選單!

index.asp

#nwr {
height:15px;
overflow:hidden;
position:relative;
}
#nwr div {
position:absolute;
line-height:15px;
}
#nwr marquee {
height:15px;
display:block;
}
#nwr div a{
padding-right:5px;
line-height:15px;
}
<style>
#nwr {
    height:15px;
    overflow:hidden;
    position:relative;
    }
#nwr div {
    position:absolute;
    line-height:15px;
    }
#nwr marquee {
    height:15px;
    display:block;
    }
#nwr div a{
    padding-right:5px;
    line-height:15px;
    }
</style>
<div id="nwr" delay="3.5">
    <div><a href="#">TEST1</a></div>
   <div><a href="#">TEST2</a></div>
   <div><a href="#">TEST3</a></div>
   <div><a href="#">TEST4</a></div>
   <div><a href="#">TEST5</a></div>

</div>
<script language="javascript" type="text/javascript" src="__index_run.js"></script>

__index_run.js
window.appVersion = window.navigator.appVersion;
if(window.appVersion != null){
window.appVersion = window.appVersion.toUpperCase();
window.MacIE5 = ((window.appVersion.toUpperCase().indexOf("MSIE") >= 0) &&
(window.appVersion.toUpperCase().indexOf("MACINTOSH") >= 0) &&
(window.appVersion.indexOf("5.0") >=0));
}

window.OPR = (window.opera!=null) || false;
window.IE = (document.all && (!window.OPR)) || false;
window.IE55 = (window.IE && window.createPopup != null && document.createComment == null) || false;
window.MOZ = (window.outerWidth && !window.OPR && (window.navigator.product != null)) || false;
window.IE50 = (window.IE && (document.createTextNode != null) && (window.createPopup == null)) || false;
window.IE60 = (window.IE && document.createComment != null ) || false;
window.IE40 = (document.all && !window.IE50 && !window.IE55 && !window.IE60 && (window.opera == null) ) || false;
window.MS = (window.navigator.userAgent.toLowerCase().indexOf("windows") >= 0 ) || false;
window.MAC = (window.navigator.appVersion.toLowerCase().indexOf("mac") >= 0 ) || false;
window.CSS1 = (document.compatMode != null) || false;
window.GDA = ((window.IE55 || window.IE50 || window.MOZ || window.IE60) && !window.MAC);

if(window.IE){
window.WIN98 = (window.navigator.userAgent.toLowerCase().indexOf("windows 98") >= 0); /* windows 98 has serous pronlem with DirectX when use filter, we need to remove that;*/
}

function gObj(ID){
if(document.getElementById == null){
document.getElementById = document.all;
}
if(ID == null){
return null;
}
return document.getElementById(ID);
}

function gTags(srcDocument, TagName){
if(document.getElementsByTagName == null){
return (new Array());
}
if(TagName == null){
return (new Array());
}
return srcDocument.getElementsByTagName(TagName);
}

function gAttr(srcObj,attributeName){
if(srcObj == null || attributeName == null){
return null;
}
if(srcObj.getAttribute == null){
return null ;
}
attributeName = srcObj.getAttribute(attributeName);
if(attributeName == ""){
attributeName = null
}
return attributeName;
}

var nwr = gObj("nwr");
function RenderNWR(){
if(nwr && (window.IE || window.MOZ) && (!window.MAC)){
nwr.Hover = false;
nwr.onmouseover = function(){
this.Hover = true;
}
nwr.onmouseout = function(){
this.Hover = false;
}
nwr.style.display = "block";
nwr.divs = new Array();
var divs = gTags(nwr,"div");
var tbs = gTags(nwr,"table");
var tds = gTags(nwr,"td");

for(i=0;i
if(gAttr(tbs[i],"width")){
tbs[i].removeAttribute("width");
}
}
for(i=0;i
if(gAttr(tds[i],"width")){
tds[i].removeAttribute("width");
}
}
var scrolldelay = gAttr(nwr,"delay") || 2.5;
if(isNaN(scrolldelay)){
nwr.style.display = "none";
return;
}

scrolldelay = Math.max(parseFloat(scrolldelay) * 1000 ,1000);
for(i=0;i
nwr.divs[i] = divs[i];
divs[i].m = setTimeout("void(0)",0);
divs[i].n = i;
divs[i].o = 10;
divs[i].style.top = nwr.offsetHeight*2 + "px";
if(divs[i].id == null || divs[i].id == ""){
divs[i].id = "_marquee_" + i;
}
divs[i].flyin = function(){
clearTimeout(this.m);
this.style.visibility = "visible";
var b = this.n-1;
if(b < 0){
b = nwr.divs.length-1;
}
if(this.o > 0 ){
if(this.parentNode.Hover == false){
this.o += -2;
this.style.top = ((this.parentNode.offsetHeight * this.o/10)) + "px";
}
this.m = setTimeout("gObj('" + this.id + "').flyin()",100);
}else{
this.o = 0;var n = this.n+1;
if(n > (nwr.divs.length-1)){
n =0;
}
n = gObj("_marquee_" + n);
if(n.id != this.id){
this.m = setTimeout("gObj('" + this.id + "').flyout()",(scrolldelay));
n.m = setTimeout("gObj('"+n.id+"').flyin()",(scrolldelay-0));
}
}
}

divs[i].flyout = function(){
clearTimeout(this.m);
if(this.o < 10 ){
if(this.parentNode.Hover == false){
this.o+=2;
this.style.top = ( -(this.o/10 * this.offsetHeight) -2) + "px";
}
this.m = setTimeout("gObj('"+this.id+"').flyout()",100);
}else{
this.o = 10;
this.style.top = this.parentNode.offsetHeight*2 + "px";
}
}
}

if(divs.length > 0){
divs[0].style.top = "1px";
divs[0].flyin();
}
}else if(nwr){
nwr.style.display = "block";
nwr.style.overflow = "visible";
nwr.style.height="auto";
var divs = gTags(nwr,"div");
if(divs.length >= 1){
divs[0].style.position = "static";
divs[0].style.visibility = "visible";
}
}
}

function RenderNWR98(){
nwr.style.display = "block";
var divs = gTags(nwr,"div");
var tbs = gTags(nwr,"table");
var tds = gTags(nwr,"td");
for(i=0;i
if(gAttr(tbs[i],"width")){
tbs[i].removeAttribute("width");
}
}

for(i=0;i
if(gAttr(tds[i],"width")){
tds[i].removeAttribute("width");
}
}
divs = new Array();
divs = gTags(nwr,"div");
var marquee = "";
for(i=0;i
marquee+= "
" + divs[i].innerHTML+ "
";
}
nwr.innerHTML = "" + marquee +"" ;
}

if(window.WIN98){
RenderNWR98();
}else{
RenderNWR();
}

Posted by Linawang at 樂多Roodo! │16:22 │回應(0) │引用(0) │網頁程式
樂多分類：網路/3C 共同主題：網路應用 工具：編輯本文
Ads by Roodo! 

引用URL

http://cgi.blog.roodo.com/trackback/4520215
  


回最上方