Question

我正在开发一个网站，我想使用谷歌字体的图标。我可以在屏幕上看到它，但当我点击它时没有任何反应。

dates.zip(values).map{|k, v| {date: k, value: v}}

这是我想要打电话的功能。

<div class="darker">
<img class="background" src="~/Content/Images/Portada.jpg" alt="Smiley face" height="150" width="150">
<i class="material-icons" id="menu-toggle">menu</i>
</div>

<div id="page-content-wrapper">    
    <div class="container">
        <div class="flex-center">
            <div class="animated fadeInUp">
                    <img class="img-responsive centering" id="title" src="~/Content/Images/PizzeriaBritannia.png" />
            </div>

            <div class="animated flipInX text-center">
                    <h3>Desde 1986 contigo y con los tuyos</h3>
            </div>
        </div>
    </div>
</div>

完整的CSS分为两个文件：

边栏：

     $('#menu-toggle').click(function () {
    e.preventDefault();
   $("#wrapper").toggleClass("active");
});

我知道jquery工作正常，因为我已经通过按钮测试了。我认为问题可能是全屏图像与图标重叠（但它虽然可见）。有什么想法吗？

Answer 1

我无法在您#wrapper的{{1}}中找到html

    $('#menu-toggle').click(function () {
    e.preventDefault();
   $("#wrapper").toggleClass("active");
});

也许您在错误的ID上调用它？ - ＆GT;如果我没有弄错的话，page-content-wrapper看起来是正确的

Answer 2

我将你的menutoggle调用移动到img本身，而不是在你的css中添加了一个类runtime 'mysql:mysql-connector-java:5.1.36'。现在似乎工作。

http://jsfiddle.net/yae20m78/

Answer 3

我发现div字段中的绝对位置导致问题。

HTML图标无法点击

3 个答案: