Loner_Li JQuery之 通过‘Select’ 标签 改变图片的透明度

来源:互联网 发布:淘宝客设置佣金比例 编辑:程序博客网 时间:2024/04/29 23:51
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="http://localhost:1928/js/jquery-1.9.1.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $('#btnupdate').click(function () {
                var value = $('#Select1 option:selected').text();
                // var value = $('#Select1 option:selected').val();获取value值
                $('img').fadeTo(2000, value);
            });
            //方法二
            $('#Select1').change(function () {
                var thevalue = $(this).val();
                $('img').fadeTo(2000, thevalue);
            })
            $('#btn2').click(function () {
                $('img').toggle(2000);
            });
        })
    </script>
</head>
<body>
<div class="div1" style="position:absolute; top:40%; left:50%;">
    <img alt="" src="images/smallImg.jpg" />
    <br />
    <select id="Select1">
        <option value="0.0">0.0</option>
        <option value="0.1">0.1</option>
        <option value="0.2">0.2</option>
        <option value="0.3">0.3</option>
        <option value="0.4">0.4</option>
        <option value="0.5">0.5</option>
        <option value="0.6">0.6</option>
        <option value="0.7">0.7</option>
        <option value="0.8">0.8</option>
        <option value="0.9">0.9</option>
        <option value="1">1.0</option>
    </select>
    <input id="btnupdate" type="button" value="改变透明度" />
    <input id="btn2" type="button" value="淡入淡出" />
    </div>
</body>
</html>
原创粉丝点击