質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

88.59%

bxSliderでスライドショーが全くできません。どうすれば適用されるのでしょうか。

解決済

回答 1

投稿

  • 評価
  • クリップ 1
  • VIEW 593

helo

score 30

教本に沿ってコーディング作業をしているのですが、ネットからJqueryとbxSliderをダウンロードして所定のフォルダに保存し、htmlを<head>内に記述しスクリプトコードも書いてみたのですが、全く適用されません。スライドにする3点のjpgはきちんと<section>で囲み教本の指示通りやってみました。教本には、この過程でスライダーが適用されると書いているのですが・・・。どうしてよいのか途方に暮れております。
アドバイスを頂けましたら幸いです。何卒よろしくお願いします。



<link rel="stylesheet" href="common/js/jquery.bxslider/jquery.bxslider.css">
<script src="common/js/jquery-1.10.1.min.js"></script>
<script src="common/js/jquery.bxslider/jquery.bxslider.js"></script>

<script>
$(document).ready(function(){
$('.bxslider').bxSlider({
auto: true,
speed: 1000,
pause: 4000
});
});
</script>

</head>

<body>
<div id="page">

<header id="pageHead">
<h1 id="siteTitle" class="pageTitle">komorikomasha</h1>
<P id="catchCopy">一人じゃできないことも、力を合わせればできる。やってみたいをカタチにする、3人の楽しいものづくり。</P>
<nav class="globalNavi">
<ul>
<li><a href="top-index.html">ホーム</a></li>
<li><a href="about/index.html">わたしたちについて</a></li>
<li><a href="portfolio/index.html">つくったもの</a></li>
<li><a href="contact/index.html">おといあわせ</a></li>
</ul>
</nav>
</header>

<div id="pageBody">

<section class="mainVisual">
<ul class="bxslider">
<li>
<div class="mainVisualText">
<h1>バッタになりたい魔法使い</h1>
<p>コモモひろましゃ制作のWeb仕掛け絵本<br>合言葉は、バッタになっちゃえ!</p>
</div>
<img src="images/mainVisual_img_03.jpg" width="980" height="500" alt="">
</li>
<li>
<div class="mainVisualText">
<h1>WordPressデザインワークブック</h1>
<p>コモモひろましゃ二人の共著によるWordPressで本格的なWebサイトを制作したい方向けの書籍</p>
</div>
<img src="images/mainVisual_img_02.jpg" width="980" height="500" alt="">
</li>
<li>
<div class="mainVisualText">
<h1>Cafe Debut</h1>
<p>baserCMSカフェサイト用汎用テーマ<br>テーマコンテスト2012飲食店系テーマ賞受賞</p>
</div>
<img src="images/mainVisual_img_01.jpg" width="980" height="500" alt="">
</li>
</ul>
</section>

・ 

  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 過去に投稿した質問と同じ内容の質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

質問への追記・修正、ベストアンサー選択の依頼

  • yoshinavi

    2018/10/07 06:17

    「kei344」さんもコメントされていますが、コードの不具合を検証するには、コードは「コードブロック」で表示させないと分かりにくくなり、間違いの元となりますので、コード表示の修正をされると、より多くの回答を得れると思います。また、「適用されない状況」も、「今はどのように表示されているのか」等、もう少し現状説明があると、より良い回答を得れると思います。

    キャンセル

  • helo

    2018/10/07 09:41

    yoshinaviさん、ご指摘ありがとうございます。今後は、質問する際は気を付けるようにしようと思います。今回は何とかうまく適用できましたので、色々ご指摘ありがとうございました。状況をどう説明すれば上手く伝わるかも今後は気をつけようと思いました。感謝いたします。

    キャンセル

  • kei344

    2018/10/07 14:11

    ここは「質問への追記・修正の依頼」です。本文を編集することが出来ますので、よろしくお願いします。また、まだ質問が「受付中」になっていますが、「ベストアンサー」を選び「解決済」にされてはいかがでしょうか。

    キャンセル

回答 1

checkベストアンサー

0

<link rel="stylesheet" href="common/js/jquery.bxslider/jquery.bxslider.css">
<script src="common/js/jquery-1.10.1.min.js"></script>
<script src="common/js/jquery.bxslider/jquery.bxslider.js"></script>


恐らくここの参照先が間違ってます

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2018/10/07 09:37

    回答いただきまして、ありがとうございます。
    今しがた、パスの再確認していましたらおかしなところがありました。ご指摘の通り、間違いがありましたので改善しましたら、無事スライドショーが適用されました。
    ありがとうございました。感謝いたします。

    キャンセル

  • 2018/10/07 09:41

    習熟中ならデバックも覚えましょう
    デバックが一番大事!
    https://postd.cc/how-to-not-hate-javascript-tips-from-the-frontline/#gfm-2

    キャンセル

  • 2018/10/07 09:44

    デバックですか。ありがとうございます。まだまだ初心者なので覚えるように頑張ります!重ね重ねありがとうございました。

    キャンセル

  • 2018/10/07 15:17

    皆さま、本当にありがとうございます。質問させていただく際は、分かり易くするように心がけます。
    本当にありがとうございました。

    キャンセル

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 88.59%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る