jquery - 如何允许用户放大或缩小 html 表格的大小？

Question

好吧，我正在做一个小音板项目，我添加了一个东西来创建更动态的网站

当您单击增加/减少时，它会增加/减少按钮中的文本大小。不幸的是它没有用，除非它包括一个表格调整大小和一个按钮调整大小。

以下是实际代码：http://serverbc.ucoz.com/main.html
滚动到页面底部以查看按钮！

我需要添加什么才能使其正常工作？

顺便提一句！这是我如何编写文本的代码：

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">       
    </script>
    <div id="box1">
    <font color=white>rrrr</font>
    </div>

    <script type="text/javascript">
    $(document).ready(function(){
     $(".increaseFont,.decreaseFont").click(function(){
     var type=  $(this).val();
      var curFontSize = $('#box1').css('font-size');
      if(type=='increase'){
       $('#box1').css('font-size', parseInt(curFontSize)+1);
       }
     else{
       $('#box1').css('font-size', parseInt(curFontSize)-1);
      }
        });
    });
    </script>


    <div><input type="button" value="increase" class="increaseFont"></input></div>
    <div><input type="button" value="decrease" class="decreaseFont"></input></div>

Answer 1

您正在为按钮类使用固定宽度Button。它不会以固定的宽度增长。从类中删除宽度属性Button并尝试。

：检查这个http://jsfiddle.net/akhilrs/qXHKn/