0

我在网站http://www.freetimemagazine.net上使用幻灯片拉斯维加斯背景,但初始上传时间太长,您看到没有元素的黑色背景太久。我想放置一个不属于滑块的背景静止图像,但它仅在加载的初始时间出现。我试图设置主体背景但我什么也没得到/默认图片?

下面是控制幻灯片的代码:

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

我不确定您是否已经知道这一点,但您需要做的就是在您的网站正文中添加背景图片。

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

您也可以考虑进一步优化您的图像。如果您尝试加载更大的图像,它们可能需要更长的时间来加载,不仅如此,而且用户不会访问您的网站来等待背景,这可能会造成糟糕的用户体验。

于 2015-12-30T08:14:43.777 回答