学步园

这一种是针对有编号的情况,如果没有编号的情况,只有<ul><li></li></ul>的话,直接一个DataList就可以将其值全部获得啦.

先看看有编号的情况吧:

第一步:定义CSS样式:

BODY {...}{FONT-SIZE: 8pt;  MARGIN: 0px; COLOR: #cb6080; BACKGROUND-REPEAT: repeat-x; FONT-FAMILY: Tahoma, "新宋体", "宋体"; BACKGROUND-COLOR: #fff;}

.li_dot {...}{FONT-SIZE: 12px; COLOR: #ed1264; FONT-FAMILY: Webdings}

#flash_show_out {...}{MARGIN-TOP: 5px; FLOAT: left; WIDTH: 322px; HEIGHT: 240px;}
#flash_show {...}{BORDER-TOP-WIDTH: 4px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 4px; BORDER-BOTTOM-WIDTH: 4px; PADDING-BOTTOM: 0px; PADDING-TOP: 0px; POSITION: relative; HEIGHT: 240px; TEXT-ALIGN: center; BORDER-RIGHT-WIDTH: 4px}
#flash_img {...}{BORDER-RIGHT: #f27e96 1px solid; BORDER-TOP: #f27e96 1px solid; FILTER: progid:DXImageTransform.Microsoft.Fade(Overlap=1.00); OVERFLOW: hidden; BORDER-LEFT: #f27e96 1px solid; WIDTH: 320px; BORDER-BOTTOM: #f27e96 1px solid; HEIGHT: 240px;}
#flash_btn {...}{LEFT: 1px; POSITION: absolute; TOP: 165px}
#flash_btn DIV {...}{MARGIN: 5px}
#flash_show_ctl {...}{PADDING-RIGHT: 0px; MARGIN-TOP: 2px; PADDING-LEFT: 0px; PADDING-BOTTOM: 3px; COLOR: #434343; PADDING-TOP: 3px; HEIGHT: 16px}
#flash_show_ctl A {...}{COLOR: #434343}
#flash_show_ctl_msg {...}{FILTER: progid:DXImageTransform.Microsoft.Fade(Overlap=1.00); FLOAT: left; OVERFLOW: hidden; WIDTH: 289px}
#flash_show_ctl_tuber {...}{Z-INDEX: 100; LEFT: 305px; POSITION: relative; TOP: -17px}
#flash_show_ctl_arrow {...}{MARGIN-RIGHT: 5px}

第二步:一个JS文件也少不了.

function show_selector_menu(select_menu_id)...{
    var select_menu = $(select_menu_id);
    if( select_menu.style.visibility == "inherit")...{
        var menu_content = select_menu.firstChild;
        if(navigator.userAgent.indexOf('MSIE')>=0)...{
            menu_content.style.marginBottom = "0";
            var select_menu_height = select_menu.offsetHeight;
            var timer = setInterval(
                                function()...{
                                    var marginb = parseInt(menu_content.style.marginBottom);
                                    if( marginb<=parseInt("-"+select_menu_height) )...{
                                        menu_content.style.marginBottom = "0";
                                        select_menu.style.visibility = "hidden";
                                        clearInterval(timer);    
                                    }else...{
                                        menu_content.style.marginBottom = (marginb-20)+"px";
                                    }
                                }
                                ,1);
        }else...{
            select_menu.style.visibility = "hidden";
        }
    }else...{
        var menu_content = select_menu.firstChild;
        if(navigator.userAgent.indexOf('MSIE')>=0)...{
            menu_content.style.marginBottom = "-"+ select_menu.offsetHeight+"px";
            var timer = setInterval(
                                function()...{
                                    var marginb = parseInt(menu_content.style.marginBottom);
                                    if(marginb>=0)...{
                                        menu_content.style.marginBottom = "0";
                                        clearInterval(timer);    
                                    }else...{
                                        menu_content.style.marginBottom = (marginb+20)+"px";
                                    }
                                }
                                ,1);
        }
        selector_is_clicked[select_menu_id] = true;
        select_menu.style.visibility = "inherit";
    }
}

var showImageIndex = -1;
var imageTimer;
function showImage(imageIndex)
...{
    var flash_img_div = document.getElementById("flash_img");
    var flash_title = document.getElementById("flash_title");    
    
    if(imageIndex>fImgs.length-1)...{
        imageIndex = 0;
    }
    
    if(!fImgs[imageIndex] || imageIndex==showImageIndex)
        return false;    
    var imgId = "__fImg"+imageIndex;
    flash_img_div.filters && flash_img_div.filters[0].Apply();
    for(i=0; i<flash_img_div.childNodes.length; i++)...{
        flash_img_div.childNodes[i].style.display = "none";
    }
    if( document.getElementById(imgId) )...{
        var imga = document.getElementById(imgId);
        imga.style.display = "block";
        if(imga.tagName=="OBJECT")...{
            imga.rewind();
            imga.Play();
        }
    }else...{
        var pos = fImgs[imageIndex].img.lastIndexOf(".");
        if( fImgs[imageIndex].img.substr(pos+1).substr(0,3).toLowerCase()=="swf" )