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

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

新規登録して質問してみよう
ただいま回答率
85.50%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Q&A

1回答

1325閲覧

vegasを使ってのスライドショー

退会済みユーザー

退会済みユーザー

総合スコア0

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

0グッド

0クリップ

投稿2019/08/30 15:14

vegasを使っての背景画像スライドショー

参考サイト通りにやってみたのですが、スライドどころか画像すら表示されません。原因がわかりません。
どなたかご教授お願いします。
<参考サイト>(http://www.tipdip.jp/tips_posts/production/2481/)

HTML

1 <link rel="stylesheet" type="text/css" href="css/vegas.min.css" /> 2 <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script> //jQueryファイル 3 <script script type="text/javascript" src="js/vegas.min.js"></script> 4 <script script type="text/javascript" src="js/function.js"></script> //Vegas2の設定用のjsファイル 5</head> 6<body> 7 <div id="vegas"></div>

CSS

1#vegas { 2 width: 100vw; 3 height: 100vh; 4}

JS

1$(function () { 2 $('#vegas').vegas({ 3 slides: [ 4 { src: './images/vegas_sample01.jpg' }, 5 { src: './images/vegas_sample02.jpg' }, 6 { src: './images/vegas_sample03.jpg' }, 7 { src: './images/vegas_sample04.jpg' } 8 ], 9 }); 10});

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

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

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

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

querykuma

2019/08/30 16:32

script scriptとなっています。 vegas.min.cssとは別に設定ファイルのcssを読み込んでいますか?
退会済みユーザー

退会済みユーザー

2019/08/30 16:42

ありがとうございます。訂正しましたが、状態は変わりませんでした。cssは今はこのファイルだけです。
yoshinavi

2019/09/01 02:43

スライドショー関連が重複し、未解決のままです。質問をどれかに修正・統一されないと、これ以上の回答は望めないかと思われます。
guest

回答1

0

diff

1<head> 2 <link rel="stylesheet" type="text/css" href="css/vegas.min.css" /> 3+ <link rel="stylesheet" type="text/css" href="./settings.css" /> 4 <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script> 5- <script script type="text/javascript" src="js/vegas.min.js"></script> 6+ <script type="text/javascript" src="js/vegas.min.js"></script> 7- <script script type="text/javascript" src="js/function.js"></script> 8+ <script type="text/javascript" src="js/function.js"></script> 9</head> 10 11<body> 12 <div id="vegas"></div> 13</body>

投稿2019/08/30 16:39

querykuma

総合スコア777

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

退会済みユーザー

退会済みユーザー

2019/08/30 16:49

ありがとうございます。./settings.cssの内容はどのように記述すればよろしいでしょうか?
querykuma

2019/08/30 16:52

./settings.cssは #vegas { width: 100vw; height: 100vh; } のことです。
退会済みユーザー

退会済みユーザー

2019/08/30 17:03

かわりはありませんでした。回答ありがとうございます。
querykuma

2019/08/30 17:17

もう一度再現してみたところscript scriptのままでも画像が表示されました。 ./settings.cssを追加したら画像が表示されるようになりました。 デベロッパーツールを使用されていないのでしたら問題解決のために使用されることをオススメします。 エラーメッセージが確認できます。
退会済みユーザー

退会済みユーザー

2019/08/31 03:55

ありがとうございます。エラーメッセージ確認したところ画像が読み込めてません。上記の画像パスであってるのでしょうか?overrlayフォルダ内の[.png]を使用しても変化はありませんでした。質問が重なりすみません。
querykuma

2019/08/31 04:10

> 上記の画像パスであってるのでしょうか? 画像パスが合っているのに画像が読み込めないのは想像しにくいですが、何か予想外のことが発生している可能性もあります。 エラーメッセージを書いていただければ何かわかるかもしれません。
退会済みユーザー

退会済みユーザー

2019/08/31 04:21

こちらです。 Failed to load resource: net::ERR_FILE_NOT_FOUND  02.png:1 Failed to load resource: net::ERR_FILE_NOT_FOUND  vegas_sample01.jpg:1
querykuma

2019/08/31 04:58

画像パスを合わせないと同じエラーメッセージが発生しました。 すみませんが、それぐらいしかわかりませんでした。
退会済みユーザー

退会済みユーザー

2019/08/31 05:22

わかりました。もう一度見直してみます。ありがとうございました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

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

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問