矩阵形状的选择器

最新推荐文章于 2024-09-12 20:46:12 发布

zhanghuiyu01

最新推荐文章于 2024-09-12 20:46:12 发布

阅读量303

点赞数

CC 4.0 BY-SA版权

分类专栏： js

本文链接：https://blog.youkuaiyun.com/zhanghuiyu01/article/details/80826050

js 专栏收录该内容

8 篇文章

订阅专栏

矩阵选择器的容器

<div class="selectJZ" style="display: none"></div>

蒙板

<div id="maskLayer" class="maskLayer" style="display: none;"></div>

function showJZ(){
    var width = document.body.clientWidth;
    $(".selectJZ").css('width', width * 0.9);
    $(".selectJZ").css('margin-left', -(width * 0.45));
    $(".selectJZ").css('display', 'block');
    $(".maskLayer").css('display', 'block');
    var str = "";
    for (var key in weather) {
        str += "<div key='" + key + "'>" + weather[key] + "</div>";
    }
    $(".selectJZ").html(str);
    $(".selectJZ").css('margin-top', -($(".selectJZ").height() * 0.5));
    $(".selectJZ > div").hover(function() {
        $(this).css("background-color", "#eeeeee");
    }, function() {
        $(this).css("background-color", "white");
    });

    $(".selectJZ > div").bind("click", function() {
        $("#weather").html($(this).html());
        weatherDes = $(this).attr("key");
        $(".selectJZ").css('display', 'none');
        $(".maskLayer").css('display', 'none');
    });
 }