2011-12-11 21 views
0

Lion上のruby on 3.1でサイトを開発しました。私はnivoスライダー(コンテンツローテーター)を使用しています。私はOperaとSafariで目立つ遅延なくロードします。しかし、Firefoxに読み込むときには10秒以上かかることがあります。スライダーがロードされるまで、ページ上の他のコンテンツはロードされません。また、<%= stylesheet_link_tag 'application', :cache=> true%>を使用して資産をキャッシュしようとすると、間違った数の引数エラーが発生します。Firefoxでのページ読み込みが遅い

_slider.html.erb

<link rel="stylesheet" href="default.css" type="text/css" media="screen"/> 
<link rel="stylesheet" href="nivo-slider.css" type="text/css" media="screen"/> 
<link rel="stylesheet" href="style.css" type="text/css" media="screen"/> 
<script type="text/javascript"> 
    jQuery(function() { 
     jQuery("#nivoslider-283").nivoSlider({ 
      effect:"fade", 
      slices:15, 
      boxCols:8, 
      boxRows:4, 
      animSpeed:500, 
      pauseTime:3000, 
      startSlide:0, 
      directionNav:false, 
      directionNavHide:true, 
      controlNav:false, 
      keyboardNav:true, 
      pauseOnHover:true, 
      manualAdvance:false 
     }); 
    }); 
</script> 
<div id="wrapper"> 

    <a href="http://dev7studios.com" id="dev7link" title="Go to dev7studios">dev7studios</a> 

    <div class="slider-wrapper theme-default"> 
    <div class="ribbon"></div> 
    <div id="slider" class="nivoSlider"> 
     <img src="assets/3.jpg" alt="" title="This is an example of a caption"/> 
     <img src="assets/1.jpg" alt="" data-transition="slideInLeft"/> 
     <img src="assets/2.jpg" alt="" title="#htmlcaption"/> 
    </div> 
    <div id="htmlcaption" class="nivo-html-caption"> 
     <strong>This</strong> is an example of a <em>HTML</em> caption with <a href="#">a link</a>. 
    </div> 
    </div> 

</div> 
<script type="text/javascript" src="scripts/jquery-1.6.4.min.js"></script> 
<script type="text/javascript" src="../jquery.nivo.slider.pack.js"></script> 
<script type="text/javascript"> 
    $('#slider').nivoSlider(); 
</script> 

home.html.erb

<%= render "shared/slider" %> 
<%= render "shared/calender" %> 
<div id="featured"> 
<b><%= @post.first.title %></b> 
<%= simple_format(@post.first().content) %> 
</div> 

style.cssに

.theme-default #slider { 
    margin: 5px auto 0 auto; 
    width:618px; /* Make sure your images are the same size */ 
    height:246px; /* Make sure your images are the same size */ 
} 
.theme-pascal.slider-wrapper, 
.theme-orman.slider-wrapper { 
    margin-top:150px; 
} 

.clear { 
    clear:both; 
} 

.nivoSlider 
    { 
    position:relative; 
    width: 618px; 
    height: 246px; 
    background: url('loading.gif') no-repeat 50% 50%; 
} 
.nivoSlider img 
    { 
    position:absolute; 
    top:0px; 
    left:0px; 
    display:none; 
} 
.nivoSlider a 
    { 
    border:0; 
    display:block; 
} 

application.html.erb

<!DOCTYPE html> 
<html> 
<head> 
    <title>Cor</title> 
    <%= stylesheet_link_tag 'application'%> 
    <%= javascript_include_tag 'application' %> 
    <%= csrf_meta_tags %> 
</head> 
<body> 
<img src="assets/Lighthouse%201000w%20x%20300l%20pixels.jpg" id="header-image"> 
<%= render "shared/navigation" %> 
<article> 
    <%= yield %> 
</article> 
</body> 
</html> 
+0

ために、このツールをチェックしてください! – llazzaro

+0

@llazzaroいいえ、それにショットを与えます –

+0

@llazzaroありがとう、それは多くの提案を与える。ほとんど私は理解していない。しかし、それは始まりです。 –

答えて

関連する問題