jQuery练习t89

最新推荐文章于 2024-10-08 13:51:35 发布

虾米大王

最新推荐文章于 2024-10-08 13:51:35 发布

阅读量165

点赞数

分类专栏： jQuery JavaScript 文章标签： javascript jquery

本文链接：https://blog.csdn.net/modern358/article/details/112835570

版权

JavaScript 同时被 2 个专栏收录

329 篇文章 0 订阅

订阅专栏

jQuery

296 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style type="text/css">
        .divFrame{
            border: 1px solid #666666;
            width: 197px;
            text-align: center;
        }
        .divFrame .divTitle{
            background-color: #EEEEEE;
            padding: 5px;
        }
        .divFrame .divTitle select{
            width: 150px;
        }
        .divFrame .divContent{
            padding: 5px;
        }
        .divFrame .divContent img{
            border: 1px solid #EEEEEE;
            padding: 2px;
        }
    </style>
    <script src="../js/jquery-3.5.1.js"></script>
    <script>
        $(function () {
           $("select").change(function () {
               var selValue = $(this).val();
               $("img").fadeTo(2000,selValue);
           });
        });
    </script>
</head>
<body>
    <div class="divFrame">
        <div class="divTitle">
            <select id="select1">
                <option value="0.2">0.2</option>
                <option value="0.4">0.4</option>
                <option value="0.6">0.6</option>
                <option value="0.8">0.8</option>
                <option value="1.0" selected="selected">1.0</option>
            </select>
        </div>
        <div class="divContent">
            <img src="images/img06.jpg" alt="img06.jpg" title="风景图片">
        </div>
    </div>
</body>
</html>