我在网站上使用的 slider 遇到问题。 (www.cloosedesign.com) 该网站是我为 friend 制作的作品集。所以有几件作品要展示。 每件作品都以链接形式列出,当您单击该链接时,它会显示带有 slider 的相应图片。 (我使用了一些 PHP 来从数据库 Mysql 中获取正确的图片)。
除了 SAFARI 之外,它运行良好。事实上,有时当我单击链接时,页脚的文本(黑框上的白色文本)会消失并重新出现,就像页面正在刷新一样。 该 pb 有时在第三次单击后出现,有时在多次单击后出现。
这是我的代码:
在 <head>
:
我正在调用 jquery :
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
我正在调用 slider 的 javascript 文件:
<script type="text/javascript" src="js/slides.min.jquery.js"></script>
然后在portfolio_english页面中我检查与所选作品相对应的图像(= $contenu):
<?
$images_sql = "SELECT * FROM `a_fichier`
WHERE id_fiche=".$contenu."
ORDER BY tri";
$images = mysql_query($images_sql);
echo'<div id="slides">';
echo '<div class="slides_container">';
while ($image=mysql_fetch_array($images))
{
echo "<img src='Images/PorteDoc2/".$image['nom']."' width='540' height='600' alt='".$image['titre']."' />";
}
echo '</div>';
echo '</div>'; ?>
在 php 代码之后,我编写了以下 javascript:
<script type="text/javascript">
$(document).ready(function() {
$('#slides').slides({
preload: true,
preloadImage:'Images/img/loading.gif',
pagination: true,
fadeSpeed: 0,
slideSpeed: 0,
effect: 'slide, slide',
});
});
</script>
然后我调用 footer.php 文件。 谢谢
最佳答案
这个http://jsfiddle.net/NNSqw/是执行我的意思的代码,它使用 jquery 和 ajax,现在解释 html 位非常简单,带有 id="content"
的 div 将是您的内容加载的位置进入。
现在对于 JS/JQuery,每次用户按下 id="content"
的链接时,div 的内容都会发生更改,您必须创建一个名为 get_images.php 的页面并让它使用 php 代码 $_GET['realization'];
来获取点击链接的数量,然后它就会像当前页面一样工作:)。
抱歉,我不擅长解释,但是,如果您希望我尝试进一步澄清,请说:)
编辑:
在您的 portfolio_english.php 文件中应该存在以下代码(我使用的是您网站的英文版本):
<span class="link" onClick="javascript: show_image('1')">Entreprise internationale 1</span><br>
<span class="link" onClick="javascript: show_image('2')">Entreprise internationale 2</span><br>
<span class="link" onClick="javascript: show_image('3')">Entreprise internationale 3</span><br>
<span class="link" onClick="javascript: show_image('4')">Entreprise internationale 4</span>
您应该在侧面有链接,其中有一个 onClick 事件,将它们引导至应该位于页面头部的 javascript 函数:
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
show_image(no){
$.ajax({
url: 'get_images.php?realisation='+no,
success: function(data) {
$('#content').html(data);
}
});
}
</script>
[... rest of header ...]
</head>
此外,在该文件中,您应该拥有当前显示图像的 div
<div id="content">
</div>
get_image.php
在 get_image.php 中,您需要拥有当前用于获取图像的内容,以便获取数字,例如41 进入您正在使用的 php 代码中使用:
<?php
$number = $_GET['realisation'];
[... Rest of php code to retrieve images ...]
?>
此外,如果您仍然不明白我要说什么,请尝试阅读 jquery 文档,看看您是否更理解:http://api.jquery.com/jQuery.ajax/
关于javascript - 需要帮助解决 slider javascript 与 Safari 的冲突,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10879861/