ギャラリーは最初の画像を読み込み、次に次の画像に切り替え、最初の画像に戻り、次に 3 番目の画像に戻る、というように続きます。理由はわかりませんが、これが起こっています。
jQuery:
var hoverhome = 'url("images/HomePreview.png")';
var hoverhome = 'url("images/HomePreview.png")';
var hoverhome = 'url("images/HomePreview.png")';
var hovergallery = 'url("images/GalleryPreview.png")';
var hoverhome = 'url("images/HomePreview.png")';
var empty = 'none';
var success = 'SUCCESS!';
//home
jQuery('nav .home a').hover(function()
{
jQuery('.viewport').css('background-image', hoverhome);
});
jQuery('nav .home a').mouseout(function()
{
jQuery('.viewport').css('background-image', empty);
});
//about
jQuery('nav .home a').hover(function()
{
jQuery('.viewport').css('background-image', hoverhome);
});
jQuery('nav .home a').mouseout(function()
{
jQuery('.viewport').css('background-image', empty);
});
//services
jQuery('nav .home a').hover(function()
{
jQuery('.viewport').css('background-image', hoverhome);
});
jQuery('nav .home a').mouseout(function()
{
jQuery('.viewport').css('background-image', empty);
});
//gallery
jQuery('nav .gallery a').hover(function()
{
jQuery('.viewport').css('background-image', hovergallery);
});
jQuery('nav .home a').mouseout(function()
{
jQuery('.viewport').css('background-image', empty);
});
//contact us
jQuery('nav .home a').hover(function()
{
jQuery('.viewport').css('background-image', hoverhome);
});
jQuery('nav .home a').mouseout(function()
{
jQuery('.viewport').css('background-image', empty);
});
$("#slideshow > div:gt(0)").hide();
setInterval(function() {
$('#slideshow > div:first')
.fadeOut(1000)
.next()
.fadeIn(1000)
.end()
.appendTo('#slideshow');
}, 3000);
php ファイルを呼び出します。
<script type="text/javascript"><!--//--><![CDATA[//><!--
jQuery('#slideshow > div:gt(0)').hide();
setInterval(function() {
jQuery('#slideshow > div:first')
.fadeOut(1000)
.next()
.fadeIn(1000)
.end()
.appendTo('#slideshow');
}, 3000);
//--><!]]></script>
<div id="slideshow">
<div id="slideshow1">
次に、css の画像をさまざまな div の背景として呼び出します。正常に読み込まれます。実際のところ、最初の回転中に最初のスライドを複数回表示するという不具合を除いて、スライドショー全体が正常に機能し、最初の回転後には正常に機能します。このサイトは www.bingetech.com にアップされており、さらに参照することができます。