サポート » プラグイン » トップページにCrossSlideを張りたい

  • 過去に、同じ内容のトピックがあったのですが、初心者ゆえ、それを読んでもみても理解できなかったので、質問させていただきます。http://ja.forums.wordpress.org/topic/1861?replies=3

    そしてwebで以下のサイトをみつけ、今の私の知識でその指示通りにしてみました。

    まずはjquery.cross-slide.jsとJQUery.jsをダウンロードし、それをftpにてhttp://example.co.jp/woadpressの直下に,この2つのファイルをアップロードしました。さらにimagesというファイルを作り、そのなかに、1.jpg, 2.jpg,3,jpgという3つの画像を入れ、それをwordpressフォルダのすぐ直下にアップロード。

    そして投稿の編集画面のHTMLの投稿欄から、

    <script src=”jquery-1.3.2.min.js” type=”text/javascript”></script>

    <script src=”jquery.cross-slide.js” type=”text/javascript”></script>

    <script id=”source-test1″ type=”text/javascript”><!–
    $(function() {
    $(‘#test1’).crossSlide({
    speed: 45, //px/sec
    fade: 1 //sec
    }, [
    { src: ‘images/1.jpg’, dir: ‘up’ },
    { src: ‘images/2.jpg’, dir: ‘down’ },
    { src: ‘images/3.jpg’, dir: ‘up’ }

    ]);
    });
    // –></script>
    <div id=”test1″>Loading…</div>

    と書いたのですが、プログラムが作動しません。どうしてなのでしょうか?

6件の返信を表示中 - 1 - 6件目 (全6件中)
  • jquery.cross-slide.jsとjquery.js をアップロードしたのですよね?
    なのにjquery-1.3.2.min.jsを読み込んでいるのですが、間違っていませんか?

    トピック投稿者 yazzu

    (@yazzu)

    これまでjavascriptと格闘していて返事が遅くなってしまいました。上のコードから少しだけ進展しました。というのもフレームが現れるところまできたからです(といっても、上のコードにはフレームの命令がないから当たり前なのですが)しかしjavaは起動しません。方々のサイトのソースを確かめたりしてみたり、私よりPCに詳しい人に聞いてみたのですが、jquery-1.3.2.min.jsは、読み込まなくてはいけないのでは?と思いますが、読み込まなくてもjavaは作動しませんでした。以下が今回のコードですが、よくみると変更点は、フレームの表示命令だけですね。今回は投稿のhtmlの編集画面とindex.phpの中に以下のコードを貼り付けてみました。どちらも同じ結果で、フレームだけが表示される状態です。

    <script type="text/javascript" src="jquery.cross-slide.js" ></script>
    <script type="text/javascript" src="jquery-1.3.2.min.js"></script>
    
    <h1>Static cross-fade</h1>
    <style type="text/css">
      #test1 {
        border: 2px solid #555;
        width: 300px;
        height: 225px;
      }
    </style>
    
    <script type='text/javascript' id='source-test1'>//<![CDATA[
    $(function() {
    $('#test1').crossSlide({
      sleep: 2,  //sec
      fade: 1    //sec
    }, [
      { src: 'images/1.jpg', dir: 'up' },
     { src: 'images/2.jpg', dir: 'down' },
     { src: 'images/3.jpg', dir: 'up' }
    ]);
    });
    //]]></script>
    
    <div id='test1'>Loading…</div>

    しかししかし、なぜjavaは動いてくれないのでしょう!

    kvexさんの回答を読んでいますか?

    yazzuさんの発言:

    まずはjquery.cross-slide.jsとJQUery.jsをダウンロードし、それをftpにてhttp://example.co.jp/woadpressの直下に,この2つのファイルをアップロードしました。

    yazzuさんのソース記述:

    <script type="text/javascript" src="jquery.cross-slide.js" ></script>
    <script type="text/javascript" src="jquery-1.3.2.min.js"></script>

    明らかにアップロードしたファイルと読み込んでいるファイルに違いがあります。

    1.実は「アップロードしたファイルのファイル名」を間違って発言している。(実はjquery-1.3.2.min.jsをアップロードしていた)
    2.「ソースの記述」が間違っている。(コピペなのでしょうからそんなことはないと思いますが・・・)
    でない限りうまくいかないのは当然ですね;)

    アップロードしたファイルとソースに記述するファイル名を同じにしてください。

    トピック投稿者 yazzu

    (@yazzu)

    あ、すみません、ダウンロードはこちらというサイトには、JQUery.jsとあったのですが、実際ダウンロードしアップロードしたファイルの名前はjquery-1.3.2.min.jsでした。

    ソースの記述は、コピペで、画像の所在場所を書き換えたといった感じなのですが、うまくいきませんでした。

    そして投稿の編集画面のHTMLの投稿欄から、

    そもそも投稿画面からjavascriptは動かないですよ。ソースが整形されて変わってしまうはずですから。テーマに直接記述してください。

    yazzuさん、僕も初心者ですが、やってみました。
    うまく動いているようなので、報告します。
    http://homeken.net/miz/wp/homeken7/?p=43

    yazzuさんのコードで、基本的にはいいのですが。
    javascriptがブログの本文に入っていることに問題があります。
    wordpressの仕様がどうしてそうなっているのか、素人ですので、わかりませんが、自動的に整形されて(pタグでかこまれるなど)javascriptはjavascriptといて働かなくなります。

    どうすればいいかと云いますと、
    <div id='test1'>Loading…</div>
    の部分だけをブログ本文に置き、残りのコードの部分は、別の場所に配置します。

    いろいろな方法があるようなのですが、ど素人の僕は、お手軽に、
    「header and footer」
    http://www.satollo.net/plugins/header-footer
    と云うプラグインを利用して、header部分に配置しました。

    そうしたら、割と簡単に動きました。
    試してみてください。
    不明な点がありましたら、遠慮なく、ご質問ください。

6件の返信を表示中 - 1 - 6件目 (全6件中)
  • トピック「トップページにCrossSlideを張りたい」には新たに返信することはできません。