如何停止背景滚动

时间:2013-12-18 18:17:04

标签: javascript jquery html

这是一种情况,其中背景是滚动的并且在点击它时包含图像缩略图应该使实际的pic动画化。 我完成了一切,当我点击缩略图时,图像弹出,但我希望背景是静音的(不需要滚动)。它仍在滚动,如何停止

这是我的custom.js,我应该添加什么来实现

jQuery(document).ready(function() {

    $('.space-image').click(function() {
        var image_sel_id = $(this).attr('id');
        /*$('.transparent').show();
        /*$('.gallery-wrapper').hide(1000);*/
        $('#fullimage'+image_sel_id).show().animate({left:'5%',width:'90%'},"slow");
        $('#scrollimage').attr("disabled","disabled").off('click');


    });

    $('.fullimagecont').click(function() {
        var image_clicked_id = $(this).attr('id');
        /*$('.transparent').hide().animate({width:'20%'},"slow");
        /*$('.gallery-wrapper').show(1000);*/
        $('#'+image_clicked_id).hide().animate({width:'20%'},500);


    });
});

这是html部分

<div class="content_area">
    <div class="transparent" style="display:none;width:100%;height:100%;float:left;position:relative;z-index:900;"></div>
    <div class="fullimagecont" id="fullimage5">
        <img src="img/5.jpg">
    </div>
    <div class="fullimagecont" id="fullimage6">
        <img src="img/6.jpg">
    </div>
    <div class="fullimagecont" id="fullimage7">
        <img src="img/7.jpg">
    </div>
    <div class="fullimagecont" id="fullimage8">
        <img src="img/8.jpg">
    </div>
    <div class="fullimagecont" id="fullimage10">
        <img src="img/10.jpg">
    </div>
    <div class="gallery-wrapper" id="scrollimage" style="white-space:nowrap;overflow:hidden;line-height:0;">
        <img src="img/gallery/5.jpg" class="space-image" id="5"
        /><img src="img/gallery/7.jpg" class="space-image" id="7"
        /><img src="img/gallery/8.jpg" class="space-image" id="8"
        /><img src="img/gallery/10.jpg" class="space-image" id="10"
        /><img src="img/gallery/6.jpg" class="space-image" id="6" />
    </div>

    <div class="div-slide-effect">


    </div>


</div>

提供帮助

这是.css

.fullimagecont
{
  position:absolute;display:none;width:25%;height:100%;left:5%;top:0;z-index:999;
}

1 个答案:

答案 0 :(得分:0)

我认为这应该解决它

单击弹出打开事件

,设置正文hidden的overflow属性
$('body').css('overflow','hidden');

并在弹出窗口

上将其设置为auto
 $('body').css('overflow','auto');

希望这有帮助,谢谢