ここから本文です

bxsliderについての質問です。 下記の通りにhtmlを書いているのですが、画像が縦...

sob********さん

2018/2/1011:34:38

bxsliderについての質問です。
下記の通りにhtmlを書いているのですが、画像が縦に並んでしまい、スライドになりません。

htmlファイルとbxsliderのフォルダ(フォルダ名:bxslider)は同じフォルダ内に入っていて、画像が入っているフォルダ(フォルダ名:まいうぇぶ)はbxsliderのフォルダの中に入っています。
どこかおかしなところがあるんでしょうか…。もし気になる点が見つかれば回答をお願いします。
ちなみに、パソコンの方に問題があるかもと思い、あるwebサイトのbxsliderのサンプルページを開いたら、そのページではしっかりスライドになっていました。パソコンはASUSのノートパソコンを使用しています。
以下、htmlです。

<html>
<head>
<title>test</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js" type="text/javascript"></script>
<script src="bxslider/jquery.bxslider.js" type="text/javascript"></script>
<script src="bxsliderjquery.bxslider.min.js" type="text/javascript"></script>
<script src="bxslider/jquery.easing.1.3.js" type="text/javascript"></script>
<script src="bxslider/jquery.fitvids.js" type="text/javascript"></script>
<link href="bxslider/jquery.bxslider.css" rel="stylesheet" />
<link href="bxslider/jquery.bxslider.min.css" rel="stylesheet" />
<style type=“text/javascript”>
$(function(){
$('#slider1').bxSlider({
auto:true,
speed:1000,
pause:500
});
});
</style>
</head>
<body>
<div id="slider1">
<div><img src="bxslider/まいうぇぶ/BODY..jpg"></div>
<div><img src="bxslider/まいうぇぶ/オムライス.jpg"></div>
<div><img src="bxslider/まいうぇぶ/ごん狐.jpg"></div>
<div><img src="bxslider/まいうぇぶ/スープとサラダ.jpg"></div>
<div><img src="bzslider/まいうぇぶ/ストーブ.jpg"></div>
<div><img src="bxslider/まいうぇぶ/バニラアイス.jpg"></div>
<div><img src="bxslider/まいうぇぶ/ハンバーグ.jpg"></div>
<div><img src="bxslider/まいうぇぶ/三峯神社 森.jpg"></div>
<div><img src="bxslider/まいうぇぶ/三峯神社 鳥居.jpg"></div>
</div>
</body>
</html>

閲覧数:
69
回答数:
2
お礼:
250枚

違反報告

ベストアンサーに選ばれた回答

ken********さん

2018/2/1114:23:13

試しに私もやってみました。
っが・・・ なぜか質問者さんと同じ症状・・・

なぜ?
よーく確認してみると
bxslider.min.js
jquery.bxslider.css
などコピペしたファイルの中身が、なぜかHTMLファイルになっている怪現象・・・

再度コピペし、中身がきちんとJS、CSSの記述になってるか確認しアクセスすると正常に表示されました。

一度、JSファイルとCSSファイルの中身が書き換わってないか確認してみてください。

  • ken********さん

    2018/2/1114:31:47

    それと
    <style type=“text/javascript”>
    $(function(){
    $('#slider1').bxSlider({
    auto:true,
    speed:1000,
    pause:500
    });
    });
    </style>

    ではなく
    <script>
    $(function(){
    $('#slider1').bxSlider({
    auto:true,
    speed:1000,
    pause:500
    });
    });
    </script>

    にしましょう。

  • その他の返信(5件)を表示

返信を取り消しますが
よろしいですか?

  • 取り消す
  • キャンセル

ベストアンサー以外の回答

1〜1件/1件中

プロフィール画像

カテゴリマスター

yoy********さん

2018/2/1012:00:35

無駄なのが、入っているからでは?

必要なのは、
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js" type="text/javascript"></script>
<script src="bxsliderjquery.bxslider.min.js" type="text/javascript"></script>
<link href="bxslider/jquery.bxslider.min.css" rel="stylesheet" />
<style type=“text/javascript”>~</style>

これだけでいい。

返信を取り消しますが
よろしいですか?

  • 取り消す
  • キャンセル

この質問につけられたタグ

みんなで作る知恵袋 悩みや疑問、なんでも気軽にきいちゃおう!

Q&Aをキーワードで検索:

Yahoo! JAPANは、回答に記載された内容の信ぴょう性、正確性を保証しておりません。
お客様自身の責任と判断で、ご利用ください。
本文はここまでです このページの先頭へ

「追加する」ボタンを押してください。

閉じる

※知恵コレクションに追加された質問は選択されたID/ニックネームのMy知恵袋で確認できます。

不適切な投稿でないことを報告しました。

閉じる