1

我在网站上使用的滑块遇到问题。( www.cloosedesign.com ) 该网站是我为朋友制作的作品集。所以有几个作品要展示。每件作品都被列为一个链接，当您单击该链接时，它会向您显示带有滑块的相应图片。（我已经放了一些 PHP 从数据库 Mysql 中获取正确的图片）。

它工作正常，除了在 SAFARI 上。实际上，有时当我单击链接时，页脚的文本（黑框上的白色文本）会消失并重新出现，就像页面正在刷新一样。此 pb 有时会在第三次点击后出现，有时会在多次点击后出现。

这是我的代码：

在<head>：我正在调用 jquery：

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>

我正在调用滑块的 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 文件。谢谢

4

2 回答 2

0

好的，在进行任何真正的调查之前，让我们先解决一些问题。

  1. 将 jQuery 更新到最新版本 (http://jquery.com/)，然后你就不需要缓动插件了，因为它现在是内置的。

  2. 不要绑定到 window.onload，而是使用正确的语法来使用 jQuery：

 

$(document).ready(function() {
    $('#slides').slides({
        preload: true,
        preloadImage:'Images/img/loading.gif',
        pagination: true,
        fadeSpeed: 0,
        slideSpeed: 0,
        effect: 'slide, slide',
    });
});

如果这不好，请制作一个非常小的测试页面，其中只有您与滑块一起使用的代码，并检查它是否仍然存在问题。

老实说，我真的不知道为什么人们使用这些庞大的滑块插件，制作滑块是一项简单的小工作，只需要不到 10 行 jQuery。

于 2012-06-04T11:02:57.387 回答
0

这个http://jsfiddle.net/NNSqw/是执行我的意思的代码，它使用 jquery 和 ajax，现在，解释 html 位非常简单，divid="content"将是您的内容将被加载到的位置.

现在到 JS/JQuery，每次用户按下链接时，div 的内容id="content"都会发生变化，您必须创建一个名为 get_images.php 的页面，并使用 php 代码$_GET['realisation'];获取点击的链接的数量和从那里它将像您当前的页面一样工作:)。

抱歉，我不擅长解释，但是，如果您希望我尝试澄清更多，请说:)

编辑：

在您的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>​

获取图像.php

在您的 get_image.php 中，您需要拥有当前用于获取图像的内容，因此要将数字（例如 41）输入您正在使用的 php 代码中，请使用：

<?php
$number = $_GET['realisation'];
[... Rest of php code to retrieve images ...]
?>

另外，如果你仍然不明白我要去哪里尝试阅读 jquery 文档，看看你是否更了解它：http: //api.jquery.com/jQuery.ajax/

于 2012-06-08T19:39:12.457 回答