<!DOCTYPE html>
<html>
<head>
<title></title>
<script type="text/javascript" src="jquery-1.4.2.min2.js"></script>
<script type="text/javascript">
$(function () {
$(".msg_caption a").click(function () {
var minSize = 12;
var maxSize = 18;
var numSize = 10;
var numStep = 2;
var currentSize = $("#content").css("font-size");
var textFontSize = parseFloat(currentSize, numSize);
var unit = currentSize.slice(-numStep);
var styleName = $(this).attr("class");
if (styleName == "bigger") {
if (textFontSize >= maxSize) {
alert("已经最大了");
} else {
textFontSize += numStep;
}
} else if (styleName == "smaller") {
if (textFontSize <= minSize) {
alert("已经最小了");
} else {
textFontSize -= numStep;
}
}
//设置content的字体大小
$("#content").css("font-size", textFontSize + unit);
});
});
</script>
</head>
<body>
<div class="msg">
<div class="msg_caption">
<a href="#" class="bigger">A+</a>
<a href="#" class="smaller">A-</a>
</div>
<div>
<p id="content" style="font-size: 12px;">
近日,国内相关媒体曝光了国产奔驰GLK 260车型的谍照;该车最大的亮点是换装了1.8T涡轮增压发动机。据报道,这款车将有望在11月份的广州车展上亮相,并于年底以以2014款车型的身份推出,预计售价在35万元起
</p>
</div>
</div>
</body>
</body>
</html>
jquery 字体放大放小适合触屏版、web版
最新推荐文章于 2021-07-01 19:32:52 发布