Question

我一直在试图弄清楚如何在我正在处理的网站上停止此滑块：[加载链接]在加载页面时加载并推送所有内容。

我试图在这篇文章中实现Jerph的答案：Hide jQuery Accordion while loading但是没有成功的人可以解释这个问题并告诉我我做错了什么。

Slider由以下人员发起：

 $('#slider .items').cycle({
  fx: 'blindY',
  timeout: 9599
 });

在Jerphs回答：

<body <?php echo $bodyid;?>>
<script type="text/javascript">jQuery('body').addClass('js');</script>

我在主样式表中放置了滑块样式的body.js。

  body.js #slider  {margin-bottom:10px; margin-top:-60px}
  body.js #slider  .items {height: 283px; width:990px; position:relative;}
  body.js #slider  .items div {height:212px; width:990px; padding-top: 72px; background: 0px 72px no-repeat url("../images/banners/banner-bg.png"); background-color:transparent !important;}
  body.js #slider  .items div h1 {float: left; font-size:30px; color:#fff; font-weight:bold; margin:20px 0 0 20px;}
  body.js #slider  .items div p {float: left; font-size:20px; color:#C5E9FF; font-weight:bold; margin: 10px 0 0 20px; line-height:23px;}
  body.js #slider  .items div img {float: right; position:relative;}

  body.js #slider  .items .item-1 img {right:-1px; top:-23px; height:233px;}
  body.js #slider  .items .item-1 p, #banner .items .item-1 p {width:530px;}

  body.js #slider  .items .item-2 img {right:50px; top:-71px; height:281px;}
  body.js #slider  .items .item-2 p, #banner .items .item-2 p {width:530px;}

  body.js #slider  .items .item-3 img {right:50px; top:-32px; height:242px;}
  body.js #slider  .items .item-3 p, #banner .items .item-3 p {width:530px;}

  body.js #slider  .items .item-4 img {right:50px; top:-62px; height:272px;}
  body.js #slider  .items .item-4 p, #banner .items .item-4 p {width:550px;}

  body.js #slider  .banner-signup { position:relative; top:-20px; left:-20px; margin:20px 0 0; display:block; float:right; width:100px; height:41px; background: top left no-repeat url(../images/banners/sign-up.png);}
  body.js #slider  .banner-tour { position:relative; top:-20px; left:-20px; margin:20px 15px 0 0; display:block; float:right; width:73px; height:43px; background: top left no-repeat url(../images/banners/tour.png);}

  body.js #slider  .items .item-1 p a.banner-signup { position:relative; top:5px; left:-20px; margin:20px 0 0; display:block; float:right; width:100px; height:41px; background: top left no-repeat url(../images/banners/sign-up.png);}
  body.js #slider  .items .item-1 p a.banner-tour { position:relative; top:5px; left:-20px; margin:20px 15px 0 0; display:block; float:right; width:73px; height:43px; background: top left no-repeat url(../images/banners/tour.png);}

  body.js #slider  .items .item-3 p a.banner-signup { position:relative; top:-27px; left:-43px; margin:20px 0 0; display:block; float:right; width:100px; height:41px; background: top left no-repeat url(../images/banners/sign-up.png);}
  body.js #slider  .items .item-3 p a.banner-tour { position:relative; top:-27px; left:-43px; margin:20px 15px 0 0; display:block; float:right; width:73px; height:43px; background: top left no-repeat url(../images/banners/tour.png);}

有没有办法可以阻止这个滑块爆炸？

Answer 1

我认为你应该在这里做的只是隐藏带有.hidden类display:none的滑块，直到jQuery.ready(…)触发，并在初始化后使滑块可见。

Answer 2

滑块爆炸的原因是我目前在20左右使用的php include语句。我省略了这些，滑块完全加载。

JQuery滑块在页面加载时爆炸

2 个答案: