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

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

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

CSS(Cascading Style Sheet)の第3版です。CSS3と略されることが多いです。色やデザインを柔軟に変更することが可能になります。

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

JavaScript

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

Q&A

解決済

1回答

2066閲覧

aタグとimgタグをループさせる方法を教えてください。

syun1819

総合スコア22

CSS3

CSS(Cascading Style Sheet)の第3版です。CSS3と略されることが多いです。色やデザインを柔軟に変更することが可能になります。

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

JavaScript

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

0グッド

0クリップ

投稿2017/01/21 07:03

編集2017/01/21 22:28

htmlで複数のaタグに複数のimgタグで画像を入れてそれをスライドショーしている状態にしたいです。

html

1コード<!DOCTYPE html> 2<html lang="ja"> 3 <head> 4 <meta charset="utf-8"> 5 <meta name="keywords" content="ベネヴィータ王慈のホームページ"> 6 <meta name="description" content="ベネヴィータ王慈のホームページです。"> 7 <link rel="stylesheet" type="text/css" href="ベネヴィータ王慈のホームページ.css"> 8 <link rel="next" crossorigin="use-credentials" href="障がい者支援施設 ベネヴィータ王慈.html 地域密着型特別養護老人ホーム ベネヴィータ王慈.html 障がい児通所支援 地域生活支援 エンゼルきっず.html"> 9 <script type="text/javascript" src="ベネヴィータ王慈のホームページ.js" charset="utf-8"></script> 10 <title>ベネウィータ王慈のホームページ</title> 11 </head> 12 <body> 13 <a class="b" href="ベネヴィータ王慈のホームページ.html">ベネヴィータ王慈のホームページ</a> 14 <p/> 15 <div class="wa"> 16 <a href="障がい者支援施設 ベネヴィータ王慈.html"><img src="ap.jpg" alt="ベネヴィータの写真" alt="地域"></a> 17 <a href="地域密着型特別養護老人ホーム ベネヴィータ王慈.html"><img src="hp/花見0405 (5).JPG" alt=""></a> 18 <a href="障がい児通所支援・地域生活支援 エンゼルきっず.html"><img src="hp/花見0405 (61).JPG" alt=""></a> 19 <a href="ベネヴィータ王慈へのアクセス.html"><img src="hp/花見0405 (6).JPG"></a> 20 <a href="ベネヴィータ王慈のホームページ (行事).html"><img src="hp/忘年会1228 (277).JPG" alt=""></a> 21 </div> 22 <div class="tx"> 23 <p><a href="#ne">法人の理念</a><a href="#vi">ベネヴィータの意味</a>は?</p> 24 <section class="be"> 25 <p id="ne">こころゆたかに すこやかに</p> 26 <p class="be">私たち王慈福祉会の使命は、ご利用者、地域の方々そして働く職員が生活していく上で価値あるものでなければならないと考えています。私たち王慈福祉会は、お一人おひとりの尊厳、ニーズや権利に対する思いを心に刻み、暖かで和やかな空間、心の拠り所を整備し、誰もが幸せになれるよう、笑顔や心のこもった高水準のサービスの提供を心がけています。<br> 27 私たちの高齢者や障がい者、児童のための高品質な支援・サービスが、地域の方から最初に選ばれる存在であり続けたいと常に願っています。<br> 28 ご利用される皆さんの権利の尊重、倫理綱領につきましては、こちらに掲載しております。<br></p> 29 <p id="vi">ベネヴィータの意味とは?</p> 30 <p>よき人生、よき命、よい暮らしという意味です。</p> 31 </section> 32 </div> 33 </body> 34</html>

css

1コードdiv.wa{ 2 max-width: 800px; 3 max-height: 305px; 4 overflow: scroll; 5} 6a img{ 7 width: 300px; 8 height: 300px; 9 margin: 6px 6px; 10}

javascript

1コードtry { 2 var img_jpeg_src=canvas.toDataURL("image/jpeg"); 3 document.getElementById("image_jpeg").src=img_jpeg_src; 4 document.getElementById("data_url_jpeg").firstChild.nodeValue= 5} catch (e) { 6document.getElementById("image_jpeg").alt="" 7} 8$(function() { 9 $('a').each(function(i){ 10 $(this).prop('href', 11 '') 12 }) 13});

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

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

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

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

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

kei344

2017/01/21 08:05

質問文のコードはそれぞれコードブロックで囲んでいただけませんか? ```(バッククオート3つ)で囲み、前後に改行をいれるか、コードを選択して「<code>」ボタンを押すとコードブロックになります。また、「ループ」とは何がしたいのかを質問文に具体的に追記してください。
kei344

2017/01/21 12:43

「ループ」とは何がしたいのかを質問文に具体的に追記してください。
syun1819

2017/01/22 01:04

divタグの中にあるaタグとimgタグをスライドショーをさせたいです。
guest

回答1

0

ベストアンサー

スライドショー jquery」で検索し、ライブラリを使用されれば実装出来ます。

もし、勉強のためにスライドショーを組むというのであれば、もう少しコードを書いた状態で無いとアドバイスができません。また、その際にはどのような動きをするのかを具体的に書かれたほうが回答を得やすいと思います。

投稿2017/01/22 02:18

kei344

総合スコア69407

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

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

syun1819

2017/01/22 02:33

ありがとうございます。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.48%

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

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

質問する

関連した質問