0

Web サイトhttp://www.freetimemagazine.netでスライドショー Vegas Background を使用していますが、最初のアップロード時間が長すぎて、要素のない黒い背景が長時間表示されます。スライダーの一部ではなく、最初の読み込み時にのみ表示される背景の静止画像を配置したいと思います。ボディの背景を設定しようとしましたが、何も得られませんでした。js プラグインで、スライダーの最初の画像の「遅延」をより速く設定しようとしましたが、何も得られませんでした...どうすればイニシャルを設定できますか/デフォルトの画像?

以下は、スライドショーを制御するコードです。

1) テーマ.js

/**
* Vegas background image slider
*/

$.vegas('slideshow',
{
   // delay: 5000,
    backgrounds: [
        { src: 'img/home/01.jpg', delay: 100, fade: 100 },
        { src: 'img/home/02.jpg', delay: 5000, fade: 2000 },
        { src: 'img/home/03.jpg', delay: 5000, fade: 2000 },
        { src: 'img/home/04.jpg', delay: 5000, fade: 2000 },
        { src: 'img/home/05.jpg', delay: 5000, fade: 2000 },
        { src: 'img/home/06.jpg', delay: 5000, fade: 2000 },
      //  { src: 'img/home/07.jpg', fade: 2000 },
        { src: 'img/home/08.jpg', delay: 5000, fade: 2000 },
      //  { src: 'img/home/09.jpg', fade: 2000 },
        { src: 'img/home/10.jpg', delay: 5000, fade: 2000 },
        { src: 'img/home/11.jpg', delay: 5000, fade: 2000 },
      //  { src: 'img/home/12.jpg', fade: 2000 },
        { src: 'img/home/13.jpg', delay: 5000, fade: 2000 },
        { src: 'img/home/14.jpg', delay: 5000, fade: 2000 },
        { src: 'img/home/15.jpg', delay: 5000, fade: 2000 }
    ]
})('overlay');

2) スタイル.css

body  {
font-family: 'Open Sans', sans-serif;
font-size: 14px;
font-size: 1.4rem;
color: #292929;
background: #000;  }
4

2 に答える 2

0

これを追加してみてください:

$.vegas( 
     { src: 'img/home/01.jpg' }
);

$.vegas('slideshow', {
    backgrounds: [ 
    ...
于 2014-03-01T23:20:26.953 に答える
0

すでにこれを理解しているかどうかはわかりませんが、Web サイトの本文に背景画像を追加するだけで済みます。

body {background: url('../img/yourimage.jpg') 0 0 no-repeat; background-size: cover;}

画像をもう少し最適化することも検討してください。大きな画像を読み込もうとすると、読み込みに時間がかかるだけでなく、ユーザーがサイトにアクセスしてバックグラウンドを待つことがなくなり、UX が低下する可能性があります。

于 2015-12-30T08:14:43.777 に答える