- ベストアンサー
HPにスライドショーが反映されません。
- Macユーザーの方がHPにスライドショーを反映させる方法を教えてください。
- HTMLタグを使用してスライドショーを設置しましたが、写真が反映されずデザインも崩れます。
- 他のサイトに掲載されているタグを試してみましたが上手く反映されません。お力をお借りしたいです。
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
そのうまくいかないページのURLをここに晒してくれれば話は早いのに・・・ 「HPのタグではPCに入っているものに干渉できませんよね」という一文を見ても、 「ソフト」という語の用法を見ても、何かまだ根本的なところを 理解しておられない、ような気がします。でも大丈夫です。すべては慣れです。 >写真は反映されましたが大きさが変えられず 写真のサイズはあらかじめ調整しておいた方がいいです。 その、画像ファイル自体のサイズを。 えー、デスクトップにひとつフォルダを作ってください。 フォルダ名はとりあえず「test」。 で、以下の６つを「test」の中に（同一階層に）置きます。 http://jquery.com/download/からダウンロードした ▼「jquery-1.11.1.min.js」 http://bxslider.comからダウンロードした「jquery」フォルダの中の、 ▼「images」フォルダ（スライドショーの部品が入ってる） ▼「jquery.bxslider.css」 ▼「jquery.bxslider.js」 以下は自分で作る。 ▼「sample1.jpg」から「sample4.jpg」までを入れた「img」というフォルダ ▼test.html 以上、三角形つけた６つです。６つを、並列に置く。ここまで、いいですか。 ちなみに CSSファイルとかJavaScriptファイルとかは 「ソフト」じゃないです。あくまでファイル。 で、最後の「test.html」の中身は、以下をコピペ。 「<div align="center">」なんてのは褒められたもんじゃないのかも 知れませんが、いつの日にか、慣れたらてきとうに改善してください。 <!--↓↓↓ここから--> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>sample</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <style type="text/css"> <!-- body {margin-top:100px; } --> </style> </HEAD> <body bgcolor="FFFFFF"> <script type="text/javascript" src="jquery-1.11.1.min.js"></script> <script type="text/javascript" src="jquery.bxslider.js"></script> <link href="jquery.bxslider.css" rel="stylesheet" /> <script type="text/javascript"> $(document).ready(function(){ $('.bxslider').bxSlider({ auto: true, //自動再生有効 slideWidth:600, //スライドショーの幅 }); }); </script> <div align="center"> <ul class="bxslider"> <li><img src="img/sample1.jpg"></li> <li><img src="img/sample2.jpg"></li> <li><img src="img/sample3.jpg"></li> <li><img src="img/sample4.jpg"></li> </ul> </div> </body> </html> <!--↑↑↑ここまで--> 以上の結果↓ https://dl.dropboxusercontent.com/u/47661325/test/test.html https://dl.dropboxusercontent.com/u/47661325/test.zip あと、HTML関連の話題では、MacユーザーだとかOSのバージョンとかは 基本的に無関係です。だから今後はこっち↓の方がいいかも。 http://oshiete.goo.ne.jp/category/252
その他の回答 (1)
- toast5
- ベストアンサー率37% (239/638)
あと、URLの末尾に余計なカッコがついてるので、 クリックしても404エラーになります。正しくはこう。 http://matome.bgah.jp/2014/01/javascript-bxslider/ あと、 >imgファイルを作ってそこに使いたい写真を入れる それはファイルじゃなくて、フォルダです。
補足
toast5様 ご指摘とご指導ありがとうございます。 今までより一番形に近く作製することができました。 ですが、何故か写真の反映が出来ません…test.htmlを開いても、何も無いスライドが展開されるのみです。 これはどのように解決したら良いのでしょうか… 写真の大きさを、頂いたものと同じくらいの大きさにしても反映されませんでした… https://www.dropbox.com/sh/ily44a9h2atrqge/AAAeRDM4S0vdI0bU1QnWhPg9a?dl=0