[html] タグが付いた質問
898
質問
0
票
0回答
8 件の閲覧数
クイズの選択肢を選択したら解説を表示させたい
質問を見てくださってありがとうございます!
題名のとおりなのですが、
クイズの選択肢を選択したら解説を表示させたいと考えております。
現在、HTML,CSS,JavaScriptでクイズを開発しております。
■やりたいこと
・クイズの選択肢を選択したら解説を表示させたい
・単一選択から複数選択可能にしたい
■悩んでいる箇所
・アコーディオンの展開のイベントをHTML,...
1
票
0回答
63 件の閲覧数
preg_match_all で指定した正規表現が意図した通りマッチしない
下記のように href が #title から始まる <a> タグを全て削除したいのですが、
現在のコードだと上手く preg_match_all が動作していません。
どう変更すればよいでしょうか?
$content
<a href="#title1">stack</a>
<a href="#title2">...
0
票
0回答
44 件の閲覧数
jQueryにてdiv要素にキー入力を代行させる方法
やりたいこと
下記のdiv要素である"down"をクリックしている間は、下矢印キーを押し続けている扱いにする方法はないでしょうか?
試す限りでは押し続けている判定は、onmousedownを使えば出来そうですが、javascriptに「キー入力を代わりに入力させる」方法がわかりません。
<div class="down">
<h1&...
0
票
0回答
36 件の閲覧数
モバイル検索結果のファビコンの表示について
現在、我々が運営するウェブサイトが、モバイル版のGoogle検索結果上でファビコン(アイコン)で表示されない状態です。(他のサイトは表示されております)
ここにファビコンを表示させるためには、どのような方法がありますでしょうか?
0
票
2回答
44 件の閲覧数
ボタンクリックでコンソール上にメッセージを表示させたい
ボタンをクリックするたびにコンソール上にonとoffを交互に表示させるプログラムを作りたいのですが、ボタンを押しても動作しません。ページを読み込んだ段階でコンソール上に"Uncaught TypeError: btn.addEventListener is not a function at a.js:11"と表示されます。
そこでjsファイルの11行目を"btn....
0
票
1回答
60 件の閲覧数
jQuery .each() .find()を用いた特定要素、属性値取得について
jQueryを用いて、以下HTMLより
「hoge1hoge1_2 数量:1 , hoge2hoge2_2 数量:2 , hoge3hoge3_2 数量:3 ...」と
class="boxlist_"内にあるclass="list_"分だけ繰り返しで、
特定属性のみピックアップし文字列が連結されreturn値を返したい次第です。
なお、...
0
票
0回答
20 件の閲覧数
list.jsでページ分割とフィルタを同時に使用したい。
list.jsを使用して、ページ分割、ソート、フィルタを使用したいです。フィルタのみだと動くのですが、ページ分割を行うと、フィルタが機能しません。解決方法を教えてください。よろしくお願いします。
<div id="users">
<input type="text" class="fuzzy-search"...
0
票
0回答
64 件の閲覧数
ブラウザ更新時の読み込みシームレス化を実現したいです
ブラウザ更新時の画像読み込みシームレス化(以下のブラウザページ)のページ全体版を実現したいと思っています。
https://teratail.com/questions/271650
上の過去の質問回答の構文では画像URLを指定していますが、画像URLではなくWEBページ全体を表示させる場合に更新時のラグ(ページが完全に表示されるまでの読み込み中の状態)...
1
票
1回答
90 件の閲覧数
URL 指定での Web ページ表示時にリダイレクトされるのを停止したい
以下の構文、サンプルページのとおり、URL を指定して表示させる HTML を書いたのですが、当該 URL を表示後、当該 URL 側の挙動として自動的に別の URL にリダイレクトされてしまいます。(この例ですと、「https://www.jma.go.jp/bosai/map.html#5&contents=earthquake_map」を指定していますが、「https://www....
0
票
1回答
52 件の閲覧数
Vue の v-select において、特定の選択肢の文字の色を変えたい
Vue の v-select において、特定の選択肢(または文字列)の文字の色を変えたいのですが、何か方法があるでしょうか。
v-select タグ内で
<v-select
:items="hoge"
item-color="green"
></v-select>
としても、...
0
票
0回答
34 件の閲覧数
Wordファイルをhtmlに変換した際に画像データをスムーズに変換させる方法
Wordで記載した文章(画像が貼り付け有り)について、Wordの機能でhtml形式(Webページフィルター後/フィルターせずの両方ともで試しました。)で保存をしました。
その際に画像は表示されず、画像があった個所にはリンクが張られていました。
そのリンクにPNGで保存した画像を毎回作ればいいのですが、数が多いと苦労します。
どうにか画像付きのhtmlで保存する事は可能でしょうか。
...
2
票
1回答
73 件の閲覧数
h1のfont-sizeは親要素を継承しないのでしょうか?
下記のコードを書いてみました。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style>
html {
font-size: 10px;
}
</style>
&...
1
票
1回答
95 件の閲覧数
GitHub Pages で一部の画像だけ表示されない
以下です。よろしければご回答のほど、よろしくお願いいたします・・!
聞きたいこと
GitHub Pagesにて公開したページにて、imgフォルダ内の一部の画像のみ表示されない。
対象URL
https://yukinoshita1103.github.io/leopaquiz/quiz.html
詳細
クイズのWebアプリ。
選択肢として、imgディレクトリに置いた画像をランダムに表示させたいです。...
0
票
1回答
75 件の閲覧数
Google ChromeでHTMLとCSSをモバイル表示をさせたときの画面サイズが異常です。
現象
Google Chromeのモバイル表示を320×568pxに設定して、そのサイズに合わせたコード(HTMLとCSS)を書いていたのですが、VS CodeのLiveServer機能でGoogle Chromeのモバイル表示をさせると、980×1739pxの大きさになってしまいます。
期待値
Google Chromeのモバイル表示で、320×568pxの大きさで表示させること。
再現手順
...
0
票
1回答
68 件の閲覧数
form->error のclsssを複数指定は可能か
cake
$this->Form->error('Test.id', null, ['wrap' => 'p', 'class' => 'error-message']);
以下html
<div>
<div>
<p>
<input type="text" name="data[test][id]&...
0
票
1回答
56 件の閲覧数
Tumblrのタイトル部分と日付け書式の変更方法
Tumblrの無料テーマ
https://dharmatheme.tumblr.com/
を利用して個人の備忘録のようなものを作っりたいです。
https://rum-julep.tumblr.com/post/643969604868292608
↑この画像の「あいう」となってるタイトル部分を見やすくしたいので横の画像の「美しい見出しのデザイン」のようにしたいのですが ...
0
票
1回答
53 件の閲覧数
CSSを読み込みたいのですが、どうしても読み込まれません。
現象
CSSが全く読み込まれません。
期待値
CSSを読み込んでブラウザ(Google Chrome)に反映させたいです。
再現手順
下記のHTMLとCSSをGoogle Chromeで実行すれば反映されます。CSS設計の形式は、FLOCSSです。
index.html
<!DOCTYPE html>
<html lang="ja">
<...
0
票
1回答
53 件の閲覧数
CSSで、画像を横並び&重ならない&ディスプレイサイズに合わせて縮小したい。
聞きたいこと
画像を横並びで表示し、かつ、ディスプレイサイズに合わせて縮小する方法。
html,css,javascript関連です。
現状と理想
現状)画像を横並びで表示し、かつ、ディスプレイサイズに合わせて縮小しているが、重なってしまっている。
理想)画像を横並びで表示し、かつ、ディスプレイサイズに合わせて縮小しているが、重ならないようにしたい。
背景
2枚の画像から、...
0
票
0回答
26 件の閲覧数
firebaseにて、htmlファイルごとに異なるdataを作成したい
今現在行っていることは下記です。
複数のhtmlファイル(様式は同じだが異なるジャンル)を用意する→モーダルウィンドウにてタイトルと文字を記入して送信すると、その中身がdivにひとつひとつ追加されていく
そしてfirebaseにてdataを作成し、HTMLに反映されるところまでは実装できたのですが、
もちろんですがひとつのhtmlファイルだけではなく(ex)a.html)、b.html、c....
0
票
0回答
57 件の閲覧数
cssで縦幅が決まっていないブロックの上下中央揃え
cssで縦幅のpx指定をしない(中身に合わせた大きさになって欲しい)ブロックの上下中央揃えがうまくいきません。
下記は一応うまくいきますが、htmlやbodyに100%指定しなくてはならないのが気になります。
html,
body {
height: 100%;
}
.wrapper {
display: flex;
justify-content: center;
...
0
票
1回答
66 件の閲覧数
JavaScriptでwindowのサイズ可変を制限するには
JavaScriptで500pxより下にwindow幅を小さく出来ないようにJavaScriptで制限をかけたいのですが、そのようなAPIは提供されているのでしょうか?
調べてみて、window.minWidthという物が出てきたのですが上手く動作しなかったです。
chromeで動作すれば良いです。
すいませんよろしくお願いします。
0
票
1回答
88 件の閲覧数
JavaScriptでPNG画像などのデータをバイナリ形式で取得したい
FileReader.readAsText()のサンプルを試して動作させているのですが、PNG画像を選択すると文字化けしてしまいます。
文字化けしないようにするにはどうしたら良いでしょうか?
やりたいことは、PNG画像のデータを以下のようなバイナリ形式で受け取り、これをそのままデータベースに保存したいです。データはサーバ側でPythonを動作させているのでそちらで受け取りたいです。
b'\...
1
票
1回答
46 件の閲覧数
adblock等におけるhrefのフィルター
hogeとfugaが両方、順不同でURL文字列(href属性の値)に含まれる要素を消したい場合、どのようなフィルタになるのでしょう?
a href="example.com/hoge/fuga"
a href="example.fuga.com/hoge"
などは消して、
a href="example.com/hoge"
a href=...
0
票
0回答
110 件の閲覧数
htmlでリンクを押したらcsvファイルを読み込んでグラフを表示させたい
実現したいこと
web上のリンクかボタンを押したら特定のcsvファイルを読み込みグラフを表示させる。
試したこと
以下のソースコードはファイル選択ボタンからcsvファイルを選択しグラフを表示させるプログラムです。
これをローカルにあるcsvファイルを読み込むプログラムに変更させるところで行き詰まっています。
<!DOCTYPE html>
<html lang="ja&...
0
票
1回答
60 件の閲覧数
TableのRowspanのカラムがSafariとFirefox上で見ると潰れて見えてしまう
下記のようなテーブルを作成しChromeで表示すると綺麗にrowspanで一つにしたカラムが見えているんですが、FirefoxとSafariだとこのrowspanしたカラムが潰れて見えてしまいます。
縦書きの指定が悪いのかと思いましたが縦書き自体はFirefox、Safari上でも表示されているのでrowspanがうまく表示されていないのかなと思いました。
...
0
票
1回答
96 件の閲覧数
HTML,CSS gridなしで画像配置をしたい
画像の配置調整を行いたいです。
大きく2つあります。
1つ目
1段目を2段の両端に揃えて均等配置配置したいです。
→ 現状上手くいっておらず、解決策を教えて頂きたいです。
2つ目
3段目の2枚を2段目の左側に配置したい為、gridを使用して調整しています。
Chormeだと正常ですが、IEだとgrid非対応の為レイアウトが崩れます。
→ CSS変換など試したのですが、上手くいきません。
...
0
票
0回答
41 件の閲覧数
AutodeskのForge Viewerでマークアップを2D上の指定の場所に表示させる方法を教えてください
HTML+JSにautodesk-forgeのforge viewerを組み込んで開発を行っています。
viewer上の2Dの特定のオブジェクトの近くにテキストを表示したいと考えており、方法を探しています。
下のコードの修正点、または他の実現方法があれば教えてください。よろしくお願いします。
構成
HTML+JS
試したことと結果
下記の記事の内容を実践
https://adndevblog....
0
票
1回答
75 件の閲覧数
sliderProスライド画像が少しだけ下がってしまう。
前回投稿したのですが、良い回答がいただけなかったので、再編集しました。
スニペットは拡大して確認していただけると幸いです。
まだ、スニペットでまだ表現できていない部分があるので合わせてわかる方ご教授お願いします。
1.スニペットでは<{section name=i loop=5}>が効いていません。本番環境ではループで画像を取得する処理が入っています。...
0
票
1回答
40 件の閲覧数
formで囲ったラジオボタンから選択された値を取り出したい
本来フォームに囲まれた中なら下記のコードでチェックされた値を取得出来るのですが、おそらくnav, Ul, li 等を使用しているので上手く取得出来ないのでしょうか?
let DOM = {}
DOM.languageInputs = document.querySelectorAll('.language input[name="country"]')
console.log(DOM....
0
票
0回答
62 件の閲覧数
Next.js 「Can't perform a React state update on an unmounted component」という警告が発生し、メモリリークしてしまいます。
Next.jsでmdファイルをpre-renderingしてhtmlに変換し、その結果を表示するシンプルなサイトを作成しています。
非常にシンプルな構成のサイトなのですが、ページ遷移や言語切り替えをローディング直後に連打すると
Warning: Can't perform a React state update on an unmounted component. This is a no-op,...
0
票
1回答
74 件の閲覧数
bracketsでjqueryによるbgSwitcherプラグインを使用したいのですが、うまく適用できません
表題の件について、モニターの最上部にてフルスクリーンでの複数画像のスライドを行いたいのですが、
jsの読み込みが原因なのか、複数画像の相対パスの表示方法が違うのか、うまくできない状況です。
以下に、うまく表示されない原因ではないかと思われる箇所を3点表記しました。
js読み込みとして、htmlのheadに<script src="https://ajax.googleapis....
0
票
1回答
57 件の閲覧数
jQuery でマウスホバー時に border を出したい
hoverしたときにspanタグにborderを出したいのですが上手くいきません。
どうすればうまくいきますか?
<ul class="nav">
<li class="nav-item"><a class="navbar-link" href="/xxx.html"><...
0
票
0回答
72 件の閲覧数
JavaScriptとHTMLを使ってボタンをクリックすると音が出るコードを知りたい
このようなコードで実行してみたのですが、ボタンをクリックしても音が鳴りません。
ボタン一つずつに別の音を入れ、クリックで音を鳴らすには何処を修正したら良いのでしょうか。
また、キーボードとボタンの紐づけをさせるにはどのようなコードを入れると良いでしょうか?
宜しければ回答をよろしくお願いします。
html
<!DOCTYPE html>
<html lang="ja&...
0
票
1回答
45 件の閲覧数
flexboxで要素の高さが揃わない
解決したいこと
cssでコーディングをしているのですが、flexboxで要素の高さが揃わないです
状況
下記のコードがHTMLです。
<div class="plans-content">
<div class="plans-content-item">
<h3 class="plans-content-...
1
票
1回答
141 件の閲覧数
CSSにおけるpxの使い所を知りたい
今CSSを学んでいるのですが、素朴な疑問として、サイズにおける px の使用するタイミングが知りたいです。
デザイン・コーディングしてて思うのが、pxで指定するとよくレイアウト崩れや、ウインドウサイズを変えたときに縦横比を保ったまま伸縮されなくて困ったりします。
なので、pxより%で指定したほうがいいのかと思ったりします。
pxの使用どころはどういったタイミングなのでしょうか?
...
0
票
0回答
46 件の閲覧数
CSSにおいてボックスがはみ出る問題を解決したい
HTMLとCSSの勉強をしています。
以下のようなデザインなのですが、グレーの背景をグリーンのボックスがはみ出てしまうので、グレーの背景の底辺とグリーンのボックスの底辺を揃えたいです。そのためにはどうするのがいいでしょうか?
気になっているのが、mainクラスの高さがheaderクラスを含んでいるのに対して、
select_test_areaクラスはheaderクラスの高さを選んでいないため、...
0
票
1回答
66 件の閲覧数
フォームのlabelとinputの位置を揃えたい。
現在HTMLのlabelタグに挟まれている文字列に空白を含ませる事で揃えているのですが、あまり良い解決作には見えないので、cssを使って空白なしでも揃うようにしたいです。
<div class="song__info-cover">
<div class="song__info">
...
0
票
1回答
78 件の閲覧数
次のホームページのアニメーションの技術を分析したい
Javaを中心にWebアプリ開発を主にしています。
今ホームページ制作にも興味を持ち、色んなサイトを見ているのですが、
以下のサイトのアニメーションに興味があります。
このサイトのHoldすると結晶になるようなアニメーションはどんな技術を使っていますでしょうか?
あるいは調べ方を教えていただけますと幸いです。
https://tsuyoshi.in/
URLがHTMLではないので、...
2
票
1回答
60 件の閲覧数
検索エンジンの検索結果に自サイトの主要コンテンツを表示させる方法を知りたい
自社のホームページを検索すると、トップページのみしか表示されません。
他社様のホームページを検索してみると、トップページ以外の各ページが下段に表示されます。(添付画像)
同じ様に表示させるには、どの様なタグを組み込めば良いのでしょうか。
ご回答をお待ちしております。
参考画像の様に、表示させたいのですが方法をご教示くださるとたすかります。
宜しくお願いします。
0
票
2回答
76 件の閲覧数
Javascriptで後から追加した要素をふわっと出現させるには
JavaScriptでボタンをクリックすると新しく要素を追加するコードを書いてボタンを押すと要素が追加されるんですが、その追加された際のアニメーションを下からふわっとフェードインするようにしたいです。
イメージとして最初は要素が2つある。この最初の2つはふわっとさせられる。
<div class="dlcard effect"></div>
<...
-1
票
1回答
62 件の閲覧数
Spring Tool Suite 4でscriptタグ内のエラー注釈を消したい
Spring Tool Suite 4でHTMLの編集を行っており、
scriptタグ内にthymeleafやjavascriptの記載を行うとエラー注釈が出てしまいます。
こちらを消す方法をご教授頂ければ幸いです。
0
票
1回答
42 件の閲覧数
CSSにおいて正方形に余白がある状態にしたい
今HTML,CSS,Bootstrapでページをデザインしています。
画像を正方形にトリミングし、5個ずつ2列で表示します。
以下のようにできているのですが、
それぞれの画像がくっつかず、余白をつけるようにしたいです。
現在、縦横比を保てるように実装できているのですが、余白の設定に詰まっています。
サポートいただけないでしょうか?
▼HTML
<div class="flex-...
0
票
1回答
34 件の閲覧数
CSSにおいて画像を上下に5つずつ配置したい
今HTML,CSS,Bootstrapでページをデザインしています。
https://www.f2ff.jp/event/iotc-2020-02にある以下のようなデザインをしたいです。
動きはなくてよくて、配置のみになります。
これを上下2列で5ボックスずつで配置したいです。
どのようにすればいいでしょうか?今色々試しているのですが詰まっているのでアドバイスいただけたらと思います。
...
0
票
1回答
39 件の閲覧数
HTML,CSSによるデザインで要素の高さを70%にしたい
html,css,bootstrapを使って、ページのデザインを編集しています。
以下のような画像とセクションの高さを70%にしたいのですが、なかなかうまくいかず詰まっています。
恐れ入りますが、手助けいただけないでしょうか?
以下該当部分のHTMLとCSSです。
▼html
<section class="section-box" data-scroll-index=&...
1
票
1回答
186 件の閲覧数
tailwind cssでradioをボタンのように表示したい
tailwind cssをインストールして使っています。
inputのradioをボタンのように装飾表示して、クリックしたら色が変化するようにしたいのでこのようにしました。
@tailwind base;
@tailwind components;
@tailwind utilities;
.radio-button:checked + label {
@apply bg-indigo-...
0
票
1回答
51 件の閲覧数
画像のリンクをhoverした際に下線が出るのを防ぎたい
現在rails勉強中で、ブログアプリを作成しています。画像アイコンをルートに戻れるリンクにしているのですが、その画像アイコンをホバーすると下線が表示されます。
これを出ないようにするにはどうしたらいいでしょうか?
調べた方法を試したのですが、うまくいきません。
cssを以下のようにするといった内容はよく見ましたが、うまくいきません。
text-decoration: none;
border: ...
0
票
1回答
68 件の閲覧数
html css で<p>の色を赤にしたいが適用されない
提示画像はディレクトリ構造のスクショで提示コードはその中身です。
タイトル通りですが「cssで設定した <p> を赤色に設定することが出来ない」ですどうすればいいのでしょうか?
ディレクトリ構造を確認しまたがやはり正しい場所に居るためどうすればいいかわかりません。参考サイト通りにやりましたが適用されません。
https://developer.mozilla.org/ja/docs/...
0
票
1回答
46 件の閲覧数
VSCodeでインストールした拡張機能がメニューに出てこなくなった
【現状】
以前、VSCodeでHTMLを書いていました。
その際、拡張機能を色々とインストールしたのですが、その中にPreview機能もありました。
それを使って、VSCodeでコードを書きながらHTMLプレビューをし確認するといった作業をやっていました。
その後、Pythonを書く機会があってPythonをインストールし、使っていました。
その後、...
0
票
0回答
102 件の閲覧数
ServiceWorker で特定のファイルをキャッシュから削除したい
サイトをPWA化するために ServiceWorker を使用しています。
キャッシュ指定しているファイルを修正した際にそのファイルだけキャッシュからではなく、サーバーから読み込んで再度キャッシュに取り込みたいのですが方法が分かりません。
下記のサイト等で追加するメソッド(cache.put)は分かったのですが、削除する方法が分かりません。...
0
票
0回答
236 件の閲覧数
twitterのOGP(サムネイル画像)を動的に変えたい
現在HTML,JQueryでおみくじアプリを作っており、その結果をtwitterに投稿する機能があるものを作っています。
https://k49977.github.io/omikuji/
ここでやりたいこととして、おみくじ結果の画像をサムネイルに反映させたいです。つまり、twitterのサムネイルを動的に変えたいです。 それについてアドバイスいただければと思います。
...