Question

我的措辞可能都错了，但这就是我所拥有的。

现在这种方法很好用，对于广告系统来说，我没有什么可惊天动地的。

以上示例是横幅。

现在，如果我添加这个代码：ASWELL（它都是梨形）所以我显然是一个旋钮，并且已经翘起来了。由于函数不能有ID我收集它必须是碰撞的鼠标事件，所以不允许我在两个代码上独立工作的功能......基本上，如果你将下面的代码添加到小提琴......那个bugger，我将用2组代码创建一个辅助小提琴..添加给你看看问题。

http://jsfiddle.net/ozzy/9zcqW/

这个想法是每个广告都是独一无二的，信息链接悬停功能独立于每个广告，在某些情况下我们每页可能需要4个广告...所以真的有任何帮助赞赏...我之前的帖子:::可能会对已收到的答案有所启发，我发布时没有互联网，所以现在这是这个问题的更新版本......

Give this function an id

Answer 1

你也可以试试这个我不确定它是不是完美的方式，但它的工作

demo here

的javascript

function mouseOver(ban_id)
{
    if(ban_id=="flashdivb")
        document.getElementById("flashdivb").className="flash-abgb";
    else if(ban_id=="flashdivsb")
            document.getElementById("flashdivsb").className="flash-abgsb";
}
function mouseOut(ban_id)
{
    if(ban_id=="flashdivb")
        document.getElementById("flashdivb").className="flash-ib";
    else if(ban_id=="flashdivsb")
            document.getElementById("flashdivsb").className="flash-isb";
}

HTML

<!--html code for the banner-->
<div class="banner">
         <div class="bannerAd">
            <img src="http://sitehelp.com.au/images/bannerad.png">
            <a href="somelink.html">
                <div id="flashdivb" class="flash-ib"></div>
            </a>

            <a href="/media">
                <div class="ibhover" onmouseover="mouseOver('flashdivb')" onmouseout="mouseOut('flashdivb')"> </div>
            </a>
        </div>
    </div>
<!--html code for the sidebar-->
<div class="sidebar">
         <div class="sidebarAd">
            <img src="http://sitehelp.com.au/images/sidebarad.png">
            <a href="somelink.html">
                <div id="flashdivsb" class="flash-isb"></div>
            </a>

            <a href="/media">
                <div class="isbhover" onmouseover="mouseOver('flashdivsb')" onmouseout="mouseOut('flashdivsb')"> </div>
            </a>
        </div>
    </div>

CSS

/*css for the banner*/
h3 { font-family:Arial, Helvetica, sans-serif;
color:#444444;

}
/*header advert*/
.banner {
width:468px;
height:60px;
border:1px solid #aaaaaa;
position:relative;
}
.bannerAd{
position:absolute;
top:0px;left:0px;
}
.flash-ib {
    background-image: url("http://sitehelp.com.au/images/bannerinfo.png");
    height: 60px;
    width: 468px;
    position:absolute;
    top:0px;left:0px;
    /*opacity:0.4;opacity option*/
}
.flash-abgb {
    background-image: url("http://sitehelp.com.au/images/bannerinfolink.png");
    height: 60px;
    width: 468px;
    position:absolute;
    top:0px;left:0px;
    /*opacity:0.8;opacity option*/
}
div.ibhover {
    height: 20px;
    width: 25px;
    position: absolute;
    top: 40px;
    left: 443px;
}
/*css for the sidebar*/
.sidebar {
width:250px;
height:250px;
border:1px solid #aaaaaa;
position:relative;
}
.sidebarAd{
position:absolute;
top:0px;left:0px;
}
.flash-isb {
    background-image: url("http://sitehelp.com.au/images/sidebarinfo.png");
    height: 250px;
    width: 250px;
    position:absolute;
    top:0px;left:0px;
    /*opacity:0.4;opacity option*/
}
.flash-abgsb {
    background-image: url("http://sitehelp.com.au/images/sidebarinfolink.png");
    height: 250px;
    width: 250px;
    position:absolute;
    top:0px;left:0px;
    /*opacity:0.8;opacity option*/
}
div.isbhover {
    height: 20px;
    width: 25px;
    position: absolute;
    top: 230px;
    left: 225px;
}

如何使这些功能在同一页面上工作

1 个答案: