jQuery

JavaScript

Pinterest風のグリッドレイアウトをCSSのみで実装?乗り越えられない壁、代替策はないのか?Pinterstレイアウトを考察

Webに携わっている方は必ず一度は「Pintarestっぽく出来ませんか?」的なことを言われると思います。僕個人としてはPintarestのようなグリッドレイアウトはあまり好みではありません、なんせ「めんどくさい!」から。 Pint...
2022.09.14
JavaScript

slick.js(カルーセルスライダー)の要素をスマホでピンチイン・拡大したい場合

slickスライダーを使用しているとスマホでピンチイン(拡大)出来なくて困ることがあります。 以下のサンプルはピンチイン出来ないままの状態です。 jQuery(function($){ $...
JavaScript

【2022年】JavaScript入門ガイド~初心者のためのポイント解説

JavaScriptに興味を持ってこのページをご覧になっている方は、HTMLは理解できたけどJavaScriptが分からない、もしくはデザイナーだけどプログラミングを始めてみたい、といったような初心者さんだと思います。 はじめに言っ...
2022.07.06
JavaScript

2022年、今さら要素をタイル状に配置するmasonry.jsの使い方・レイアウトサンプル

かなり前にNHK関連のWebサイトが起用して話題になったjQueryプラグインのmasonry.jsですが、最近グリッドレイアウトを利用する必要がありそうな気配なので、おさらいを兼ねてmasonry.jsについてまとめました。 ...
JavaScript

JavaScriptを使ってクロスドメインの埋め込みiframeを更新(リロード)する方法

iframeはブラウザの仕様上、クロスドメイン(呼び出すHTMLが自分のドメイン上に無いこと)の場合にはjQueryでもJavaScriptでも操作が出来ません。 ただ、iframeを更新したい時にはちょっぴりイレギュラーな方法でリ...
JavaScript

jQueryにおけるeach()とは?基本的なループの使い方と注意点

配列の内容を関数で処理する際に、jQueryではeach()を、プレーンなJavaScriptではforEach()を使います。 気を付けなければならないことは、プレーンなJavaScriptにはeach()というメソッドは存在しま...
JavaScript

JavaScript、jQueryでブラウザのタブがアクティブ(非アクティブ)になったか判別/検知する方法

通常のサイト、いわゆるホームページを作成するときにはあまり意識しないですが、Webアプリケーションやブラウザ駆動のアプリケーションを作る時には意外と知っておく必要があります。 まずは、JavaScript(jQuery含む)ではブラ...
JavaScript

【JavaScript】イベントにおけるバブリング(bubbling)とは?挙動と、停止する方法

JavaScript中級者ともなると、バブリングという言葉を耳にしたことはあるはずです。文字通り英語では「Bubbling」と書き、泡が水面まで登っていく様子を模したプログラム用語です。 悩見坂 楓 バブリングってあれか、MJが飼っ...
2022.06.18
JavaScript

【意外と知らない】jQuery.fn.on()の引数にドットを用いて名前空間を表現する方法

廃れそうで廃れないjQueryですが、まだまだ知らないことが多かったりしませんか??今回はjQuery.fn.on()のイベントに名前空間を付けて管理できるという少々上級者向きな内容になります。 悩見坂 楓 名前空間って何よ、ネカフ...
JavaScript

JavaScriptにおける「$(ドルマーク)」の意味と使い方

JavaScript内で使用される「$(ドルマーク、ダラー)」には4通りの利用シーンがあります。1つは、文字列で使用される場面、2つ目はjQuery関連、3つ目はテンプレートリテラル内での使用、そして4つ目は正規表現の中です。 それ...
2022.04.01
JavaScript

【2022年】フロントエンドエンジニアとは?必要なスキル・資格・年収について徹底解説!

悩見坂 楓 フロントエンドエンジニアって実際何やってるか、ふわっとしてない? 著者 企業やプロジェクト単位でフロントエンドエンジニアの細かな定義が変わってきますからね。これがフロントエンドエンジニアだ!とは断定できない部分もありま...
2022.07.13
JavaScript

【2022年】jQuery CDN早見表と使い方入門

この記事の内容は2022/03/05時点での情報です。リンク切れや使用不可のCDNがある場合は、お問い合わせフォームからご連絡ください。Twitterアカウントからでも受け付けています。 CDNとは Content Deliv...
2022.03.18
JavaScript

JavaScriptにおけるforEach()とは?基本的なループの使い方と注意点

配列の内容を関数で処理する際に、プレーンなJavaScriptではforEach()を、jQueryではeach()を使いますね。プレーンなJavaScriptにはeach()というメソッドは存在せず、each()メソッドはjQueryに...
2022.06.24
JavaScript

Slick SliderのcenterPaddingオプションで%指定したい・基本的な使い方

jQueryのプラグインでスライダーに使われるSlickですが、centerPaddingというオプションがあります。 centerPaddingはcenterModeというメインのスライドを中央表示する機能を利用しているときに、真...
2022.03.29
JavaScript

Nスタ(ニュース番組)風のYoutubeテロップをHTML+CSSで作ってみた

毎日Nスタ(TBS)を見ていて、リスペクトを込めてNスタ風Youtubeにしてみました。HTMLとCSSとYTPlayer.jsで作成しています。 テロップ部分は画像無しでCSSで調整しています。だいぶNスタ風になったので良かった。...
2022.03.18
タイトルとURLをコピーしました