Php 幻灯片背景图像

Php 幻灯片背景图像,php,javascript,ajax,jquery,Php,Javascript,Ajax,Jquery,我有一个从数据库返回的php数组,该数组包含图像的路径,我想在HTML中构成我的包装器div的背景,我想能够添加一些javascript,在数组中循环,并以设置的间隔显示数组中的下一个图像,这可能吗,也可以对其进行一些控制,以便用户可以向后、向前跳,也可以停止幻灯片放映 实际上,我已经应用了这个方法,几乎完全按照你的要求去做。这是一个很棒的多功能插件 我还从数组中提取图像添加到页面中。插件抓取图像,隐藏不需要的内容,并循环浏览 更新刚刚注意到您希望用户能够控制前后移动。自行车也能做到这一点。看一

我有一个从数据库返回的php数组,该数组包含图像的路径,我想在HTML中构成我的包装器div的背景,我想能够添加一些javascript,在数组中循环,并以设置的间隔显示数组中的下一个图像,这可能吗,也可以对其进行一些控制,以便用户可以向后、向前跳,也可以停止幻灯片放映

实际上,我已经应用了这个方法,几乎完全按照你的要求去做。这是一个很棒的多功能插件

我还从数组中提取图像添加到页面中。插件抓取图像,隐藏不需要的内容,并循环浏览

更新刚刚注意到您希望用户能够控制前后移动。自行车也能做到这一点。看一看这张照片


Re:背景图像评论

你只要有点创意就行了。我不确定jQuery插件是否会使背景图像褪色。我不确定这是否可能(如果可能的话,我很想看看)。我所做的是绝对定位一个具有固定大小的元素,该元素充当容器,与背景图像的大小匹配,并保存循环元素(相对定位在内部)。通过在另一个元素的正上方添加另一个绝对定位的元素来添加页面内容

风格:

#cycle, #content {
  position:absolute;
  top:0;
  left:50%; 
  width:800px;
  height:600px;
  margin-left:-400px; //middle of page
  z-index:1;
}

#content {
  z-index:100;
}
Javascript:

$('#cycle') 
.after('<div id="nav">') //needs some position styling
.cycle({ 
    fx:     'fade', 
    speed:  'fast', 
    timeout: 0, 
    pager:  '#nav' 
});
$(“#循环”)
.after(“”)//需要一些位置样式
.循环({
外汇:“淡出”,
速度:“快”,
超时:0,
寻呼机:“#导航”
});
html:


你好,世界!

我们在的网站上使用jQuery交叉幻灯片插件http://www.gruppo4.com/~tobia/cross-slide.shtml


我们有一些破解插件来解决IE6+

@sico87上的transparent/opacity问题,如果您在尝试后需要一些示例,请告诉我。这将如何在背景图像中实现?这似乎是图像库的一个很好的解决方案,你为背景图像实现了它吗?@sico87,添加了一些示例代码和一个关于如何旋转背景图像的想法(这些图像实际上不是背景图像…这是一个解决方案)。是否可能使寻呼机和图像也相互淡入?当然。。。只需将超时设置为除零以外的毫秒值。(例如,超时:3000)
<div id="cycle">
  <img src="path/to/image1.jpg" />
  <img src="path/to/image2.jpg" />
</div>
<div id="content">Hello World!</div>