JS+CSS的一款导航滑动菜单-西宁威势网络科技有限公司

联系威势网络科技有限公司

JS+CSS的一款导航滑动菜单

文章作者：来源于互联网发布时间：2010/12/8 0:00:00 浏览次数：3351 次

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

for (var i=0; i<list.length; i++) {
var tmp = new rolinItem(list[i],state);
if (i == 0) tmp.pShow();
}
}

function rolinItem(obj,state) {
var speed = 0.0666;
var range = 1;
var interval;
var tarH;
var tar = this;
var head = getFirstChild(obj);
var content = getNextChild(head);
var isOpen = false;
this.pHidden = function() {
if (isOpen) hidden();
}
this.pShow = show;

var baseH = content.offsetHeight;
content.style.display = "none";
var isOpen = false;

head.onmouseover = function() {
this.style.background = "#ffffff";
}

head.onmouseout = mouseout;

head.onclick = function() {
//head.onmouseover = function() {
this.style.background = "#ffffff";
if (!state.show && !state.hidden) {
if (!isOpen) {
head.onmouseout = null;
show();
} else {
hidden();
}

}
}

function mouseout() {
this.style.background = "#FFF"
}
function show() {
//head.style.borderBottom = "1px solid #DADADA";
state.show = true;
if (state.openObj && state.openObj != tar ) {
state.openObj.pHidden();
}
content.style.height = "0px";
content.style.display = "block";
content.style.overflow = "hidden";
state.openObj = tar;
tarH = baseH;

interval = setInterval(move,10);
}
function showS() {
isOpen = true;
state.show = false;
}

function hidden() {
state.hidden = true;
tarH = 0;
interval = setInterval(move,10);
}

function hiddenS() {
head.style.borderBottom = "none";
head.onmouseout = mouseout;
head.onmouseout();
content.style.display = "none";
isOpen = false;
state.hidden = false;
}

}
var $ = function($) {return document.getElementById($)};
String.prototype.pxToNum = function() {return Number(this.replace("px",""))}
function getFirstChild(obj) {
var result = obj.firstChild;
while (!result.tagName) {
result = result.nextSibling;
}
return result;
}

function getNextChild(obj) {
var result = obj.nextSibling;
while (!result.tagName) {
result = result.nextSibling;
}
return result;
}
//]]>
</script>
</head>
<body>
<ul class="rolinList" id="rolin">
    <li>
    <h2><img src="/images/ico_03.gif" />自主开发的程序代码</h2>
    <div class="content">
    <p><img src="/images/ico-1.gif" align="left" style="margin-right:4px;" />套用别人的程序算不上开发，我们是真正的开发！有别于其它公司或个人！</p>
    </div>
    </li>
    <div style="height:1px; background-color:Gray; overflow:hidden; line-height:1px;"></div>
    <li>
    <h2><img src="/images/ico_06.gif" style="text-align:left;" />丰富的网络安全知识</h2>
    <div class="content">
    <p><img src="/images/ico-2.gif" align="left" style="margin-right:4px;"/>我们不光懂程序，还懂安全，最大限度的保障您的网站安全运行！</p>
    </div>
    </li>
    <div style="height:1px; background-color:Gray;overflow:hidden; line-height:1px;"></div>
    <li>
    <h2><img src="/images/ico_08.gif" />优秀的技术开发团队</h2>
    <div class="content">
    <p><img src="/images/ico-3.gif" align="left" style="margin-right:4px;"/>丰富的网站制作经验和专业的网络知识，提供最有力的开发源动力！</p>
    </div>
    </li>
    <div style="height:1px; background-color:Gray;overflow:hidden; line-height:1px;"></div>
    <li>

    <h2><img src="/images/ico_10.gif" />完善的售后服务体系</h2>
    <div class="content">
    <p><img src="/images/ico-4.gif" align="left" style="margin-right:4px;"/>客户的满意才是我们最大的成功！本地化企业，联系方便，必要是提供上门服务！</p>
    </div>
    </li>
    <div style="height:1px; background-color:Gray;overflow:hidden; line-height:1px;"></div>
    <li>
    <h2><img src="/images/ico_12.gif" />做有商业价格的网站</h2>
    <div class="content">
    <p><img src="/images/ico-5.gif" align="left" style="margin-right:4px;"/>有收录，有排名的网站才能为企业起到宣传效果，带来商业利益！</p>
    </div>
    </li>
    <div style="height:1px; background-color:Gray;overflow:hidden; line-height:1px;"></div>
    <li>
    <h2><img src="/images/ico6.gif" />做有商业价格的网站</h2>
    <div class="content">
    <p><img src="/images/ico-6.gif" align="left" style="margin-right:4px;" />有收录，有排名的网站才能为企业起到宣传效果，带来商业利益！</p>
    </div>
    </li>
</ul>
</body>
</html>

友情链接：

网站解决方案 | 网站推广

公司地址：青海省西宁市城西区南川西路23号青ICP备13000578号 (历史备案号:青ICP备08100091号) 公安机关备案号:63010402000123

QQ:147399120