HTML结构代码:
<div class="hd">
     <span class="big">放大</span>
        <span class="small">缩小</span>
    </div>
    <div class="bd">
     <p>上午在北京人民大会堂会见载人深潜先进单位和先进工作者代表,代表党中央、国务院,向胜利完成蛟龙号载人深潜海试任务的广大科技工作者、干部职工表示热烈祝贺和诚挚问候,勉励大家团结拼搏、开拓奋进,推动我国海洋事业不断取得新突破,为建设海洋强国作出更大成绩</p>
    </div>
Js效果代码:
<script type="text/javascript">
$(".big").click(function(){
$(".bd").css({"line-height":"+=2px","font-size":"+=2px"});
});
</script>
突然间怎么也看不出这是哪里出了问题,行高不能动态变化。JavaScript

解决方案 »

  1.   

    ({"line-height":"2px","font-size":"2px"});
      

  2.   

    <script type="text/javascript">
        $(".big").click(function(){
            $(".bd").css({"lineHeight":"+=2px","fontSize":"+=2px"});
        });
    </script>
      

  3.   

    "lineHeight":"+=2px" 这样不行吧!
     自己试了下,虽然不够简洁,但是能够达到你要的效果~~  <script type="text/javascript">
          $(".big").click(function () {
              var a = $('.bd').css("line-height");
              var b = $('.bd').css("font-size");
              a = parseInt(a.substring(0, a.length - 2)) + 2 + "px";
              b = parseInt(b.substring(0, a.length - 2)) + 2 + "px";
              $(".bd").css({ "line-height": a, "font-size": b});
          });
    </script>
      

  4.   

    好像line-height:的递增方式只能以字体的倍数为单位<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title> new document </title>
    <style type="text/css">
    .bd {
    line-height: 1;
    }
    </style>
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script> 
    </head><body>
    <div class="hd">
         <span class="big">放大</span>
            <span class="small">缩小</span>
        </div>
        <div class="bd">
         <p>上午在北京人民大会堂会见载人深潜先进单位和先进工作者代表,代表党中央、国务院,向胜利完成蛟龙号载人深潜海试任务的广大科技工作者、干部职工表示热烈祝贺和诚挚问候,勉励大家团结拼搏、开拓奋进,推动我国海洋事业不断取得新突破,为建设海洋强国作出更大成绩</p>
        </div>
    <script type="text/javascript">
    $(".big").click(function(){
    $(".bd").css({"line-height":"+=0.2"});
    });
    </script>
    </body>
    </html>