サポート » 使い方全般 » 外部JavaScript内のimgへのパスについて

  • 解決済 aoa

    (@aoa)


    外部JavaScriptファイル内の画像へのパスにつてい質問させていただきます。

    下記サイトで紹介されているphotoshufflerというスライドショー用のjsをサイトトップで使用するために設定を行いましたが、うまくいきません。
    http://solidstate.jp/ImageDisplay/slideshow/script_95.html

    このjsの構造は一枚目の画像はhtml内にimgタグで登録し、続く二枚目・三枚目は外部js内で画像へのパスを指定しています。

    wordpressで構築する前にhtmlで組んだ時には動作するのですが、wordpressで構築したところ、js自体は作動しているようで一枚目の画像はフェードアウトしてくれるのですが、続く二枚目、三枚目の画像が表示されません。

    対策としてjs内の画像へのパスを
    ./images/home/04.jpgから<?php bloginfo('template_url'); ?>/images/home/04.jpg変えてみましたが画像は表示されませんでした。

    wordpressの質問というよりjsの質問になってしましましたが、知識のある方ご教授ください。

7件の返信を表示中 - 1 - 7件目 (全7件中)
  • WordPressで使用するにはちょっと面倒なライブラリのようです。

    JavaScript内ではWordPressの関数
    <?php bloginfo('template_url'); ?>
    など使うことができません。
    おそらくHTMLで
    <img id="photoimg" src="フルパス/1.jpg" />
    となっていると思いますので、
    JavaScriptで画像を表示するさいに、このフルパスを取得してファイル名にくっつければよいです。

    お返事ありがとうございます。

    html側でフルパスの代わりに

    <?php bloginfo('template_url'); ?>

    を入れていたのですがjs内では使えないんですね。初めて知りました。
    お恥ずかしい。

    今回js内のパスをフルパスにして見ましたが反応有りませんでした。
    別の原因なんでしょうかね・・・

    Rewishさんの
    http://rewish.org/javascript/jquery_bg_switcher
    で同じようなことは実現可能かもしれません。

    また、画像のディレクトリをテーマ内ではなく、wordpressのインストールしたディレクトリに置いてしまうのも手かもしれませんね。

    #未検証

    <script type="text/javascript" src="photoshuffler.js"></script> 
    より前に PHP で

    echo '<script type="text/javascript">var templatePath = ' . get_template_directory_uri() . ';</script>';

    として js 内の画像へのパスを
    templatePath + '/images/home/04.jpg'
    ってすれば良いかも。

    Toro_Unitさん

    自分がやりたい事とほとんど同じですね。設定の簡単さでphotoshufflerを選びましたが、検討してみます。
    テーマの外にだすのも実験してみます。

    kzさん

    お恥ずかしいのですが、php自体をヘッダに書き込んだことがないくbodyナイに書くのと同じようにこんな感じで、良いのでしょうか?

    <?php
    echo '<script type="text/javascript">var templatePath = ' . get_template_directory_uri() . ';</script>';
    ?>

    ちょびっと修正:

    <?php
    echo ‘<script type=”text/javascript”>var templatePath = “‘ . get_template_directory_uri() . ‘”;</script>’;
    ?>

    文字なので ” で囲みます◎

    お返事遅くなってすみません。

    kzさん解決できました!

    本当に助かりました。

7件の返信を表示中 - 1 - 7件目 (全7件中)
  • トピック「外部JavaScript内のimgへのパスについて」には新たに返信することはできません。