JavaScript
jQueryを使わない案件、もしくは途中から入ってjQueryのエイリアスがぐちゃぐちゃになっててjQuery使いたいとき、 // ページトップ var pagetop_elements = document.getElementById('pagetop'); pagetop_elements.addEventListener('click', scroll_to_top)…
M1 Pro の MacBookPro2021を購入した。 せっかくだからクリーンな状態から新たに環境を作っていたのだが、Gulp環境で3時間ほどつまづいた。 インストールは、普通にやった。 こんな感じ。 【mac版】gulpのインストールから使い方までを解説【Web制作初心者…
レスポンシブと言っても色々ある。 PCでもスマートフォンでも同じように、コンテンツをモーダルウィンドウに表示する場合 高さ、幅の最大値を指定してあげることで、スマートフォンでもモーダルウィンドウがはみ出すことなく表示できる jQueryプラグイン「Co…
久々にjQueryのモーダル系プラグインColorboxを使う場面があった。 今回のリクエストは、外部htmlをモーダルで表示して、さらに画像のようにグループ化してギャラリー表示するというもの。公式サイト http://www.jacklmoore.com/colorbox/jQuery Colorboxを…
最近は、HTML5でのコーディングが増えてきました。 と言っても、案件によっては重要なターゲットブラウザとして、IE8とかIE7とかが入っている場合は、HTML5に拘りすぎないという考え方もあると思います。ところで、一般的にHTML5でコーディングする場合、IE8…
その1 a をクリックすると、メッセージを出す html インラインで書いてみる <html lang="ja"> <head> <meta charset="UTF-8"> <title>javaScript</title> </head> <body> <a href="#" onclick="alert('No.0が押されました');">No.0</a><br> <a href="#" onclick="alert('No.1が押されました');">No.1</a><br> </body></html>
Masonryレイアウトを実現するJSライブラリ、Isotopeを超簡単に実装してみよう。 実はいろいろと高機能。でも今回はほんとに基本的だけど感動ものの簡単実装! まずは、ライブラリをダウンロード Isotope http://isotope.metafizzy.co/ (jquery.isotope.min.…
Fireworksなんかで、書き出したSVGを、いい感じにアニメーションにしてくれる Lazy Line PainterLAZY LINE PAINTER http://lazylinepainter.info/ ここにSVGファイルをドラッグすると、、、 こんな風にプレビューがでてきて、色味なんか調整できる。 そして…