0

我正在尝试完成一些看起来很简单的事情......

我有 3div包含一个单选按钮和一些内容：

     Content of DIV1,
[]   this can be as long or as tall
     as wanted

[]   Content of DIV2

[]   Content of DIV3

使用此处其他帖子中的任何技术为每个 div 创建圆角很容易。然而，我不能只为悬停事件做到这一点，即我希望只有当鼠标悬停在 div 上时才会看到圆角框出现在 div 周围。有没有人在某处看到过这样做的例子？

编辑：我已经在使用 Prototype 和 Scriptaculous。我不能为此添加 jQuery。

4

4 回答 4

2

这会在 div 的悬停时使用 jquery 更改 CSS

print("<div id="output" class="div"></div>



<script>

    jQuery(document).ready(function() {

    $("#output").hover(function() {
        $(this).css({ 'background-color': 'yellow', 'font-weight': 'bolder' });
    }, function() {

    $(this).css({ 'background-color': 'blue', 'font-weight': 'bolder' });
    });


    }
    );

");

于 2009-01-09T15:10:09.877 回答
1

您可能遇到的部分问题在于，在大多数 CSS 实现（以及该技术的浏览器实现）中，div 没有可以附加样式规则的 :hover 方法。

正如安东尼所说，jQuery 或许能够解决这个问题。

我将如何攻击它（因为我还没有探索过 jQuery）是设置你的标签（它确实有一个悬停方法）来显示：块，你会设置所有的伴随规则，就好像它是一个 div，做它扩展以填充包含的 div，然后当然，将圆角规则添加到悬停。

另一种方法是用 a 标签包围你的 div，但话又说回来，你仍然在设置 display:block、background 和其他不属于 a 的规则。

这完全是对语法的粗暴滥用，所以在尝试我的建议之前备份你的工作。

祝你好运 - 将它一直保持在 div 上可能会更容易，并想出一些你可以做的其他事情来调出悬停效果。

于 2009-01-09T14:57:21.523 回答
0

我相信你可以用 jquery 做到这一点。
http://docs.jquery.com/CSS

http://docs.jquery.com/Events/hover

于 2009-01-09T14:49:59.870 回答
0

Css 定义悬停伪选择器，您可以利用它来解决问题或使用 javascript 来模拟在 onMouseEnter onMouseOut 事件上将 css 类添加/删除到正确 div 的效果。

于 2009-01-09T15:07:06.123 回答