2

我有一个页面需要更改字体大小。

一个简化的设置是这样的:

HTML:

<div class="box">Some dummy text in here</div>
<a href="#" class=".decreaseFont">decrease</a>

<a href="#" class=".increaseFont">increase</a>

JS:

$(document).ready(function () {

    $(".increaseFont").click(function () {
        $(".box").css("font-size", "12px");
    });

    $(".decreaseFont").click(function () {
        $(".box").css("font-size", "11px");
    });

});

CSS:

.box {
    font-size:11px;
    padding:30px;
    border:1px solid red;
}

由于某种原因,我无法确定这不起作用。这里也是一个小提琴

感谢您的时间。

4

3 回答 3

1

检查你的类名

class=".increaseFont"

.要么从中删除

<a href="#" class="decreaseFont">decrease</a>
<a href="#" class="increaseFont">increase</a>

可以选择使用

$(".decreaseFont")
$(".increaseFont")

或者在您的选择器中转义它

<a href="#" class=".decreaseFont">decrease</a>
<a href="#" class=".increaseFont">increase</a>

可以选择使用

 $(".\\.decreaseFont")
 $(".\\.increaseFont")

检查小提琴

于 2013-08-09T07:41:36.980 回答
1

这是因为您错误地应用了类名:

<a href="#" class=".decreaseFont">decrease</a>

<a href="#" class=".increaseFont">increase</a>

只需删除小提琴中的点

于 2013-08-09T07:42:51.357 回答
0

您的班级名称中不应有点.。它应该是

<a href="#" class="decreaseFont">decrease</a>
<a href="#" class="increaseFont">increase</a>
于 2013-08-09T07:41:27.367 回答