主页
问答

当鼠标移动到一超连接时触发一个窗口怎么实现

dschaicjh 2007-12-06 05:46:22

因为产品种类太多，不方便全例出来。所以用另一个页面例出所以产品，点击超连接进入这个页面。
当这样做不是很方面。我能不能用一个窗口来例出所以产品的连接呢。就是当鼠标移动到一超连接时触发一个窗口如果我点击就进入所有产品类表的页面。我也可以在被触发的窗口中
选择我要找到产品类型。就想http://www.amazon.cn/一样。只要鼠标移动到所以21类商品中就打开一个选择的窗口。

谢谢~~~~~~~~~~

...全文

9 条回复

切换为时间正序

请发表友善的回复…

发表回复

xp1056 2007-12-29

回去试试

回复赞

byteh 2007-12-10

页面html中预先定义一个div 设为隐藏
用onmouseover事件触发函数，然后用层显示

回复赞

yixianggao 2007-12-07

就想http://www.amazon.cn/一样
这个俺办不到，动态效果做不出来，给个简单实现还可以，L@_@K

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

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <title>dhtml.div.simpleMenuBoard.html</title>

    <meta name="generator" content="editplus" />

    <meta name="author" content="Gao YiXiang" />

    <meta name="email" content="yixianggao@126.com" />

    <meta name="keywords" content="javascript dhtml dom" />

    <meta name="description" content="I love web development." />

    <style type="text/css">

.board

{

    display: none;

    position: absolute;

    border: 1px solid red;

    width: 100px;

    background-color: #eeeeff;

}

    </style>



</head>

<body>

    <a id="aProducts" href="#">21 种产品</a><br />

    <div id="div1" class="board">

        <a href="#">产品 01</a><br />

        <a href="#">产品 01</a><br />

        <a href="#">产品 01</a><br />

        <a href="#">产品 01</a><br />

    </div>

    <span>

        特价商品展示01<br />

        特价商品展示01<br />

        特价商品展示01<br />

        特价商品展示01<br />

        特价商品展示01<br />

        特价商品展示01<br />

        特价商品展示01<br />

        特价商品展示01<br />

        特价商品展示01<br />

    </span>

    <script type="text/javascript">

    <!--

var hiddenId;

var iMilliSeconds = 500;

function hiddenBoard()

{

    div1.style.display = "none";

}

aProducts.onmouseover = function()

{

    div1.style.display = "block";

}

aProducts.onmouseout = function()

{

    hiddenId = window.setTimeout(hiddenBoard, iMilliSeconds);

}

div1.onmouseover = function()

{

    window.clearTimeout(hiddenId);

}

div1.onmouseout = function()

{

    hiddenId = window.setTimeout(hiddenBoard, iMilliSeconds);

}

    //-->

    </script>

</body>

</html>