-3

我正在尝试为我的第一个特定页面的移动版本编写一些 jQuery。如果我检测到较小的浏览器尺寸，我只会显示文章列表。一旦用户点击一篇文章，我希望列表最小化并且文章显示在主要内容中。我试图通过在单击文章时隐藏列表来做到这一点，但我几乎无法超越将页面制作成任何内容的基本步骤。这是我尝试在鼠标悬停时仅在文章列表周围设置边框：

<script>
    if( $(window).width() < 481 && $(window).width() > 0 ) {
        $("div.st_tabs_container").mouseover(function () {
            alert("asdfasd");
            $("div.st_tabs_container").css("border", "3px double red");
           alert("swear words");
        });
    } else {
    }
</script>

我可以让它做任何事情的唯一方法是编写 ("*").mouseover(function){ 。如果我选择了所有内容，鼠标悬停将起作用，st_tabs_container 将获得红色边框并且警报将消失。如果我尝试选择其他任何东西（.ie $("div.st_tabs_container") ）它不起作用。谁能解释一下？我确定这很简单，但我不明白。更糟糕的是，我需要在点击时执行操作的实际元素是 div.st_vertical ul.st_tabs a.st_tab_active 。我没有运气编写选择它的代码。任何和所有的智慧将不胜感激！

4

1 回答 1

1

做这样的事情，例如： http: //jsfiddle.net/ZMBWZ/ 如果它不起作用，让屏幕变小

html:

<div class="st_tabs_container"></div>

CSS：

div{
 height: 100px;
  width: 100px;
  border: 1px solid red;
}

查询：

$(function () {
    if ($(window).width() < 481 && $(window).width() > 0) {
        $("div.st_tabs_container").mouseover(function () {
            alert("asdfasd");
            $("div.st_tabs_container").css("border", "3px double red");
            alert("swear words");
        });
    }else{}
});
于 2013-01-18T00:11:52.050 回答