gpt4 book ai didi

javascript - 在一个页面上有两个 Javascript,另一个阻止另一个工作

转载 作者:太空宇宙 更新时间:2023-11-04 03:30:27 24 4
gpt4 key购买 nike

目前我的页面上运行着两个不同的 javascript。一个用于幻灯片放映,另一个用于定时图像交换。我只能让一个或另一个工作,这取决于代码中哪个脚本较低。我读了很多教程,似乎添加了 <body onload="func1();func2()">会解决问题,但事实并非如此。

我做了两个示例页面

图像交换有效但幻灯片放映不显示的地方

http://pancakeparadise.com/shirtswap.html

幻灯片放映显示并有效但图像不会换出

http://pancakeparadise.com/shirtswap1.html

感谢您提供的任何帮助!

<!DOCTYPE html>
<head>

<link href="css/style.css" type="text/css" rel="stylesheet" />
<link href='http://fonts.googleapis.com/css?family=Amatic+SC:700' rel='stylesheet' type='text/css'>

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.innerfade.js"></script>
<script type="text/javascript">
$(document).ready(
function func2(){

$('ul#portfolio').innerfade({
speed: 'slow',
timeout: 4000,
type: 'sequence',
containerheight: '500px'
});
}
);
</script>
</head>
<body onload="func1();func2()">

<div id="wholebody">
<section id="slideshow">
<aside id="slides">
<a href="/services.html"><img src="http://placehold.it/1000x500" id="frontpicturesize" alt ="" > </a>
<a href="/services.html"><img src="http://placehold.it/1000x500" id="frontpicturesize" alt=""></a>
<a href="/services.html"><img src="http://placehold.it/1000x500" id="frontpicturesize" alt=""></a>
<a href="/portfolio.html"><img src="http://placehold.it/1000x500" id="frontpicturesize" alt=""></a>
</aside>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="jquery.slides.min.js"></script>
<script>
$(function func1() {
$('#slides').slidesjs({
width: 980,
height: 500,
play: {
active: true,
auto: true,
interval: 4500,
swap: true,
pauseOnHover: true
}
});
});
</script>
</section>
<aside id="frontbubbles">
<aside id="shirtswapfront">
<p id="fronttextheader"><a href="shirtswap.html">Shirt Swap!</a></p>
<ul id="portfolio">
<li>
<a href="">
<img src="img/1.jpg" alt="" />
</a>
</li>
<li>
<a href="">
<img src="img/2.jpg" alt="" />
</a>
</li>
<li>
<a href="">
<img src="img/3.jpg" alt="" />
</a>
</li>
<li>
<a href="">
<img src="img/4.jpg" alt="" />
</a>
</li>
<li>
<a href="">
<img src="img/5.jpg" alt="" />
</a>
</li>
<li>
<a href="">
<img src="img/6.jpg" alt="" />
</a>
</li>
</ul>
</aside>
</aside>
</div>

最佳答案

您在导致冲突的同一 HTML 页面中包含两个 jQuery 文件。试试这个代码。

<!DOCTYPE html>
<head>

<link href="css/style.css" type="text/css" rel="stylesheet" />
<link href='http://fonts.googleapis.com/css?family=Amatic+SC:700' rel='stylesheet' type='text/css'>

<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="jquery.slides.min.js"></script>
<script type="text/javascript" src="js/jquery.innerfade.js"></script>
<script type="text/javascript">
$(document).ready(function (){
$('ul#portfolio').innerfade({
speed: 'slow',
timeout: 4000,
type: 'sequence',
containerheight: '500px'
});
$('#slides').slidesjs({
width: 980,
height: 500,
play: {
active: true,
auto: true,
interval: 4500,
swap: true,
pauseOnHover: true
}
});
});
</script>
</head>
<body>

<div id="wholebody">
<section id="slideshow">
<aside id="slides">
<a href="/services.html"><img src="http://placehold.it/1000x500" id="frontpicturesize" alt ="" > </a>
<a href="/services.html"><img src="http://placehold.it/1000x500" id="frontpicturesize" alt=""></a>
<a href="/services.html"><img src="http://placehold.it/1000x500" id="frontpicturesize" alt=""></a>
<a href="/portfolio.html"><img src="http://placehold.it/1000x500" id="frontpicturesize" alt=""></a>
</aside>

</section>
<aside id="frontbubbles">
<aside id="shirtswapfront">
<p id="fronttextheader"><a href="shirtswap.html">Shirt Swap!</a></p>
<ul id="portfolio">
<li>
<a href="">
<img src="img/1.jpg" alt="" />
</a>
</li>
<li>
<a href="">
<img src="img/2.jpg" alt="" />
</a>
</li>
<li>
<a href="">
<img src="img/3.jpg" alt="" />
</a>
</li>
<li>
<a href="">
<img src="img/4.jpg" alt="" />
</a>
</li>
<li>
<a href="">
<img src="img/5.jpg" alt="" />
</a>
</li>
<li>
<a href="">
<img src="img/6.jpg" alt="" />
</a>
</li>
</ul>
</aside>
</aside>
</div>

关于javascript - 在一个页面上有两个 Javascript,另一个阻止另一个工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26411522/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com