zoukankan      html  css  js  c++  java
  • body不滚动,点击遮罩层弹框消失

    点击遮罩层,弹框消失

    阻止事件冒泡return false

    这里当弹框出现的时候让body固定不要滚动添加了.body-fixed

    .body-fixed {
        height: 100%;
        overflow: hidden
    }
       $(".weui_msg_src").click(function () {
                return false;
            })
            $('#msg4').click(function () {
                $('#msg4').fadeOut();
                $('body').removeClass('body-fixed')
            })
            $('#ms4').click(function () {
                $('#msg4').fadeIn();
                $('body').addClass('body-fixed')
            });
    <div class="weui_msg_img hide" id="msg4">
        <div class="weui_msg_com">
            <!--<div data-type="close" class="weui_msg_close close-msg"><i class="icon icon-95"></i></div>-->
            <div class="weui_msg_src">
                <div class="text" style="background: #ffffff;font-size: 1rem;">
                    <div class="weui_search_bar">
                        <input type="search" class="search-input" id='search' placeholder='关键字'
                               style="box-sizing:content-box"/>
                        <button class="jx_btn weui_btn_blue jx_btn_mini"><i class="icon icon-4"></i></button>
                    </div>
                    <form action="" class="venue-list">
                        <div class="weui_cell">
                            <div class="weui_cell_bd weui_cell_primary">
                                场馆1
                            </div>
                        </div>
                        <div class="weui_cell">
                            <div class="weui_cell_bd weui_cell_primary">
                                场馆2
                            </div>
                        </div>
                        <div class="weui_cell">
                            <div class="weui_cell_bd weui_cell_primary">
                                场馆3
                            </div>
                        </div>
                        <div class="weui_cell">
                            <div class="weui_cell_bd weui_cell_primary">
                                场馆4
                            </div>
                        </div>
                        <div class="weui_cell">
                            <div class="weui_cell_bd weui_cell_primary">
                                场馆5
                            </div>
                        </div>
                        <div class="weui_cell">
                            <div class="weui_cell_bd weui_cell_primary">
                                场馆6
                            </div>
                        </div>
                        <div class="weui_cell">
                            <div class="weui_cell_bd weui_cell_primary">
                                场馆
                            </div>
                        </div>
                        <div class="weui_cell">
                            <div class="weui_cell_bd weui_cell_primary">
                                场馆
                            </div>
                        </div>
                        <div class="weui_cell">
                            <div class="weui_cell_bd weui_cell_primary">
                                <div></div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
      $(".weui_msg_src").click(function () {
                return false;
            })
  • 相关阅读:
    除adsense外适合英文站的国外广告联盟(4/12/2011更新)
    盛大云和阿里云之云主机初体验
    【行文格式】
    在线PDF阅读&编辑网站一览
    做销售不得不看的20部电影
    VS中的Code Snippet来提高开发效率
    10个免费的javascript富文本编辑器(jQuery and nonjQuery)
    【操作命令】
    SQLServer常见查询问题
    代码検索
  • 原文地址:https://www.cnblogs.com/silences/p/7099968.html
Copyright © 2011-2022 走看看