全屏旋转木马无法正确渲染

时间:2013-07-28 02:32:58

标签: twitter-bootstrap

请您查看THIS LINK,让我知道如何修复我的代码才能正常工作。正如您在演示页面中看到的那样,代码存在一些问题

1:在全屏模式下,图像顶部没有显示班级.hiddenbox的div 2-尽管设置了边距和填充为0px,页面仍然有空闲空间。水平和垂直滚动条显示在全屏幕上。

你能告诉我如何解决这些问题吗?你能告诉我如何用jquery add / romoveClass或toggleClass来设置这些设置,以便在恢复大小时将所有设置重置为默认值?  的CSS:

html,body{height:100%;}
.carousel,.item,.active{height:100%;}
.carousel-inner{height:100%;}
.fill{width:100%;height:100%;background-position:center;background-size:cover;}
.hiddenbox{ position:absolute; top:0px; margin:0; padding:0; display:none;}

jquery的:

$(document).keyup(function(e) {
 $(".fulesize").click(function(){
     $('.well').css( { margin : "0px", padding : "0px" } );
     $('.container').css( { margin : "0px", padding : "0px" } );
     $(".btn-group").css("display","none");
     $(".hiddenbox").css("display","inline");
     $("img, .container, .well, .carousel-inner, .carousel, .item, .active").toggleClass("fill");

 if (e.keyCode == 27) { $("img, .container, .well, .carousel-inner, .carousel, .item,    .active ").removeClass("fill"); }   // esc
    });  
});

0 个答案:

没有答案