jquery实现fadeTo透明度(示例)

发布时间:2020-04-21编辑:脚本学堂
分享一个jquery实现fadeTo透明度的例子,学习下jquery fadeTo函数的用法,有需要的朋友参考下。

jquery fadeTo透明度,效果图如下:
jquery fadeTo透明度

完整代码:
 

复制代码 代码示例:
<head>
    <title>fadeTo透明度_脚本学堂_http://www.jb200.com</title>
    <script src="jquery-1.9.1.js" type="text/javascript"></script>
    <style type="text/css">
        .imgclass
        {
            width: 300px;
            height: 300px;
            border: solid 1px red;
        }
    </style>
    <script type="text/javascript">
        $(function () {
            $('#Select1').change(function () {
                var thevalue = $(this).val();
                $('img').fadeTo(2000, thevalue);
            });
        })
    </script>
</head>
<body>
    <div>
        <select id="Select1">
            <option>0</option>
            <option>0.1</option>
            <option>0.2</option>
            <option>0.3</option>
            <option>0.4</option>
            <option>0.5</option>
            <option>0.6</option>
            <option>0.7</option>
            <option>0.8</option>
            <option>0.9</option>
            <option>1</option>
        </select>
    </div>
    <br />
    <div>
检测fadTo透明度效果:
<img id="img1" alt="" src="images/1.jpg" class="imgclass" /></div>
</body>