ブログ記事292件
第一セレクトで親項目を選択した際に、iphoneでは第二項目の絞り込みが出来ない不具合が出ました。optionにてjQueryでCSS「display:none;」の指令やhide()がiphoneでは無効化されてしまうようで、HTMLを再構築しないとダメなようで、これだと下層が反応しなくなる可能性があるため再構築はNGです。打ち合わせの中でclassでの表示・非表示からoption自体をグループ化し、optionのclassではなくこのグループを表示・非表示にする方法を試してみます。うな
昨日は仕事の先輩達と和食と鮨のに条さんで会食しました。この時期だけの生ウニ丼✨やっぱり美味しい〜😋野菜の天ぷらお通しの、北海シマエビ北海道の短い夏グルメの季節です😄プログラミングスクールが今日で終了しました。半年弱通って、HTML/CSS、JavaScript/jQueryを勉強しました。一通り終わりましたが、1人で一からWebサイトやアプリを作るのは難しいまだまだ、勉強と慣れが必要です。習い事は“楽しい”に越したことはないんですが、ずっと楽しいなんて
■CSSのdisplayプロパティdisplay:none;要素を隠すことができる■hoverイベント$('セレクタ').hover(function(){マウスをのせた時の処理},function(){マウスをはずした時の処理});要素にマウスが乗った時、外れた時に指定した処理を行うイベント■function~復習~イベントを用いて、ある処理を行うタイミングを設定$('セレクタ').イベント名(function(){イベント発生時に実行したい処理});■メソ
■findメソッドすべての子孫要素の中から、指定したセレクタを持つ要素を取得例)$('#wrapper').find('a').css('color'.'red');<divid="wrapper"><ahref="#">リンク1</a><p><ahref="#">リンク2</a></p></div>$('#wrapper').find('a').css('
■jQuery変数の定義var$変数名=値;例)var$div=$('div');JSの変数・定数について~復習~■変数の定義「let変数名=値」で定義例)letname='タロウ';■定数定義「const変数名=値」で定義例)constname='タロウ';変数には文字列や数値、jQueryオブジェクトなどを格納することができるjQueryオブジェクトを格納する時は、変数の頭に$を付けるのが慣例同じjQueryオブジェクトを複数
プログラミングスクールの話ですが、Javascript&jQuery基礎コースが終了しました。が、Javascript、難しくて、コーディングの意味がさっぱりわかりません💦😓“覚えられない”じゃなくて、“理解できない”ので、危機感を感じます😟次回からJavascriptとjQueryを使って、サイト作成のコース(全10回)に進む予定なんですが、不安しかありません🙁インストラクターさん曰く、「実際にサイトを作ってみれば、だんだんわかってくる。」とのことなので、ま
■$(this)クォーテーション("や')不要イベントの中で、そのイベントが起こった要素を取得例)複数のli要素にclickイベントが設定されている実際にクリックされたli要素にだけ処理を行いたい→thisを用いて、実際にイベントが起こった要素を取得するcss<ul><li>リスト1</li><li>リスト2</li><li>リスト3</li></ul>jsどのli要素をクリックしてもクリックイベントが発生$('li').clic
■textメソッドHTMLそのものを変更することが出来る$('セレクタ').text('書き換える文字列');$('p').text('こんにちは');<p>こんにちは</p>と同義になるtextメソッドの引数は、単なる文字列と認識される<h1>タグもそのまま文字列としてブラウザに表示■htmlメソッド要素の中身のHTMLを書き換えることが出来る$('セレクタ').html('書き換える文字列');$('p').text('こんにちは');<p>
■CSSメソッド$('セレクタ').css('プロバティ名','値');CSSを変更できるメソッド1つ目の引数にCSSのプロパティを、2つ目の引数にプロパティの値をいれる例)cssメソッドで要素の文字の色を変更したい$('セレクタ').css('プロバティ名','値');$('p').css('color','red');cssのp{color:red;}と同じ効果widthやfont-sizeなど他のプロパティやdisplayプロパティの
■CSSの復習id…1つのページ内で同じid名を複数回使うことができない<h1id="title">タイトル</h1>class…1つのページ内で同じid名を複数回使うことができる<divclass="lesson">レッスン</div>idは同一ページに一箇所しか存在しないのでjQueryの処理が高速化されるjQueryオブジェクトのセレクタにはできるだけidを用いるとよい。■jQue
■$(function(){...})JS処理を一旦予約状態で止めHTMLの読み込みが全て完了後にJSを実行する指示■イベントを用いて、ある処理を行うタイミングを設定$('セレクタ').イベント名(function(){イベント発生時に実行したい処理});例)clickイベント…セレクタがクリックされた時に処理をする#text要素に対するclickイベントを作成html<divid="text">Hello,World!</div>$('セレクタ')
使い方①jQueryオブジェクトを作成②jQueryオブジェクトに対してメソッド(機能)を呼び出す$('セレクタ').メソッド(引数);jQueryはJavaScript(JS)なので、文末にセミコロンが必要何をどうするか$('セレクタ')コーテーション(shift+7)セレクタにはHTMLのタグ名やclass名
半日仕事の後、プログラミングスクールへ。今日で、基礎コース25回が終わりました。25回で、Webサイトを2つ作りました。1つ目は、HTML/CSSの記述方法の基本を習ってから、実際にお手本に沿ってWebサイトを作り、Javascriptで動きをつけ、2つ目のサイトでは、HTML/CSSでWebサイトを作ったあと、レスポンシブ対応PC、スマホ、タブレットなど、色々なデバイスで表示できるようにする方法を習いました。それから、jQueryを使って、・スムース
jqueryを最新の状態で使うために(`・ω・´)jQueryの公式CDNhttps://releases.jquery.com/GoogleのCDNhttps://developers.google.com/speed/libraries?hl=ja#jqueryMicrosoftのCDNhttps://learn.microsoft.com/en-us/aspnet/ajax/cdn/overview#jQuery_Releases_on_the_CDN_0動
jQueryレッスン中級編をやっていきます。もう、Node.jsなんて知らぬ。必要に迫られるか、やることが無くなった時にでもやります。達成率50%くらいで1回休憩ー。…。休憩のつもりが寝落ちして翌日の30日になってしまいました。。レッスン中級編は完了です。しかし、if文とかいろいろ忘れてますね。jQueryのif文は書いたことがない、というのもありますが。HTMLやCSSの情報を操作するためのif、となると、書き方も少し変わります。アコーディオンの作成に手間かかり
またまた遅い更新のプログラミング日記です。私としても、そろそろ、数学とか法律の記事を書きたいのですが、ネタが集まらないのです苦笑ちなみに筆者は中卒のカス野郎でございます。一応、高卒認定試験は持ってますが、実質中卒です。うーん、Node.jsはやる気がしない。。面白さが現時点で感じられない。jQueryやってしまおう笑だって、ぱっと見こっちの方がオモローな感じなんですもん。jQueryやってみましたが、ゲーム作りとかしたいので、こっちの方が覚え
Progate:Html&cssまとめhtml・見出し:<h1></h1>・段落:<p></p>・リンク:<ahref="url"></a>・画像:<imgsrc="url">・黒点リスト:<ul><li></li><li></li><li></li></ul>・数字リスト:<ol><li></li><li></li><li></li></ol>・スパン:<span></span>FontAwesomeの読込と使用・<linkrel="stylesh
ProgateのjQueryまとめ基礎と準備:jQueryとは:JSのライブラリでhtml/cssで出来なかった動作をつけるjQueryの読み込み(index.html):<head><scriptsrc="http・・・"></script></head>jQueryファイルの読み込み(index.html):<body><scriptsrc="script.js"></script></body>bodyの終了タグ直前に設置jQuery操作開始がhtmlの読込
ProgateのjQuery上級編まとめメソッド:・eqメソッド:インデックス番号を指定する・indexメソッド:インデックス番号を取得する・prevメソッドとnextメソッド:兄弟要素から1つ前や後の要素を取得するクリックしたボタンと同じ番号のスライドを表示:例)❸をクリックするとスライド3が表示される⓪cssでactiveクラスを定義する。中身はdisplay:blockにする。.active{display:block;}①クリックしたボタンと同
Progate:jQuery上級編(パート3:ページに動きを与えよう)animateメソッド:マウスを乗せたらアイコンが大きくなるというアニメーションを入れたい場合、ex.$(‘h1’).animate({‘font-size’:’50px’},1000);*速さもミリ秒単位かslowやfastなどで指定できるhoverイベントとanimateメソッド:*実践$('.social-icon').hover(function(){$(thi
ProgateのjQuery上級編(パート2:フォームを操作しよう)フォームを操作しようjQueryを使ってHTMLから情報を取得するtextメソッド:今までのtextメソッドの使いかた:文章を書きかえる$(‘h1’).text(‘こんばんは’);今回のtextメソッドの使い方:文字列をゲットするvartext=$(‘p’).text();*引数を設定しないことによって文字列をゲットするhtmlメソッド:index.html<divid=“m
ProgateのjQuery上級編(パート1:スライド編)ProgateのjQuery上級者編は長かったので3パートに分けて記事にする。スライドを作ろうjQueryオブジェクトの構造:index.html<ul><li>リスト1</li><li>リスト2</li><li>リスト3</li></ul>script.js$(‘li’)次のようにセレクタに合致した要素が配列のように並んでいる=>[<li>リスト1</li>,
ProgateのjQuery中級編(道場レッスン)■課題1:モーダルの表示非表示手順STEP①:新規登録モーダルを表示させるSTEP②:新規登録モーダルを閉じるボタンを押して隠すSTEP①:新規登録モーダルを表示させる⑴モーダルを隠すindex.html<divclass="signup-modal-wrapper"><divclass="modal"><div><iclass="fafa-2xfa-ti
ProgateのjQuery中級編HTMLで作成したランディングページに動きをつけていくjQueryの読み込み:<head><scriptsrc=“http・・・”></script></head>jQueryファイルの読み込み:<body><scriptsrc=“script.js”></script></body>*bodyの終了タグ直前に入れることで、Webページの表示速度を早めることが出来る。readyイベントの設置:
ProgateのjQuery初級編jQueryとは:ユーザーがクリックして表示されるフォーム、アニメーションなど、HTML/CSSでは表現できなかったことが出来るjQueryの書き方:ステップ①:jQueryオブジェクトを作成。「$(‘セレクタ’)」ステップ②:メソッド(機能)を呼び出す。「.メソッド(引数);」まとめると以下のようになる。$(‘セレクタ’).メソッド(引数);*「何を」「どうするか」という書き方hideメソッド:要素を隠すメソッド
9/16午後-18深夜までは、遠方へ外出しておりました。良い日々でした。さて、今日からいつものリズムになっていきます。デイトラ中級編DAY4JavaScriptDOMJSFiddle(ジェイエスフィドル)というWeb上サービス。document.getELementById('servixe-title').innerTextというのが基本的構文「.」で区切られていて、document.どういう方法で取ってくるか('何を取ってくる').取ってきたものに対して何をする
日付を入力するコンポーネントは、jQueryのDatepickerを使います。Datepickerは、標準的なフォーム入力フィールド(<inputtype="text">)と関連付けられています。入力にフォーカスを合わせると(クリックするか、タブキーを使う)、小さなオーバーレイにインタラクティブなカレンダーが表示されます。日付を選択し、ページ上の他の場所をクリックするか、Escキーを押して閉じます。日付が選択されると、入力の値としてフィードバックが表示されます。Da
"前回HTMLでアメブロ書く"やりました。でも、HTMLだけじゃなくJavaScriptも勉強したいんですよねー。いきなりJavaScriptをHTML内に埋め込む<script>~</script>タグをHTML表示で書いてプレビューしてみたよ。そしたら「禁止タグが使われている」とメッセージが出てプレビューもできないのね。だめだこりゃ。禁止タグにどんなものがあるかというと少し、JavaScript入門を書籍などでかじっている私これらのタグが使えないって、なかなか全