1

Webサイトで使用しているスライダーで問題が発生しています。（www.cloosedesign.com）このウェブサイトは私が友人のために作ったポートフォリオです。ですから、いくつかの作品を紹介する必要があります。各作品はリンクとして一覧表示され、リンクをクリックすると、スライダー付きの対応する画像が表示されます。（データベースMysqlから適切な画像を取得するためにいくつかのPHPを配置しました）。

SAFARIを除いて、正常に動作します。実際、リンクをクリックすると、ページが更新されたかのように、フッターのテキスト（ブラックボックスの白いテキスト）が消えて再表示されることがあります。このpbは、3回目のクリックの後、またはさらにクリックした後に表示される場合があります。

これが私のコードです：

で<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

OK、実際の調査の前に、いくつかのことを邪魔にならないようにしましょう。

  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ビットを説明するのは非常に簡単です。divはid="content"コンテンツが読み込まれる場所になります。 。

JS / JQueryでは、ユーザーがリンクを押すid="content"たびに、getsが変更されたdivのコンテンツを作成し、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>

ページの先頭にある必要があるjavascript関数にリンクするonClickイベントがある側のリンクが必要です。

<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には、画像を取得するために現在使用しているものが必要です。したがって、使用しているphpコードに41などの数値を取得するには、次のように使用します。

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

また、それでも私がどこに行くのかわからない場合は、jqueryのドキュメントを読んで、それをもっと理解しているかどうかを確認してください：http: //api.jquery.com/jQuery.ajax/

于 2012-06-08T19:39:12.457 に答える