zoukankan      html  css  js  c++  java
  • jQuery简单实现div层的放大与缩小

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <style type="text/css">
            .content
            {
                border: 1px solid #ccc;
                440px;
                overflow: hidden;
                margin: 10px;
            }
        </style>

        <script type="text/javascript" src="jquery-1.4.2.min.js"></script>

        <script type="text/javascript">
            $(document).ready(function() {
                if ($('#content').height() > 400)
                    $('#content').height(400);
                $('#bigger').toggle(function() {
                    $('#content').height($('#content').height() + 100);
                    $('#bigger').html('缩小');
                }, function() {
                    $('#content').height($('#content').height() - 100);
                    $('#bigger').html('放大');
                })
            });
        </script>

    </head>
    <body>
        <div id="content" class="content">
            內容1<br />
            內容2<br />
            內容3<br />
            內容4<br />
            內容5<br />
            內容6<br />
            內容7<br />
            內容8<br />
            內容9<br />
            內容10<br />
            內容11<br />
            內容12<br />
            內容13<br />
            內容14<br />
            內容15<br />
            內容16<br />
            內容17<br />
            內容18<br />
            內容19<br />
            內容20<br />
            內容21<br />
            內容22<br />
            內容23<br />
            內容24<br />
            內容25<br />
        </div>
        <br />
        <span id="bigger">放大</span>
    </body>
    </html>

  • 相关阅读:
    vba的单元格引用的总结
    为IE窗口添加菜单实例
    给SQLServer2000升级遇到的问题
    图片上传问题(含网页图片预览)
    javascript小技巧【待续】
    成功部署JSP网站的经验总结
    VBA实例
    为JDK增加新的jar包
    理解绝对定位和相对定位布局
    资源收集
  • 原文地址:https://www.cnblogs.com/gdjlc/p/2086893.html
Copyright © 2011-2022 走看看