[B! jQuery] amauttのブックマーク

Reactは悪い意味でも現在のjQueryだし、それを受け止めないと前に進めないということ

HTMXのCEOに就任したので[1]、記念に記事を書きたいと思います。 HTMXサイトのエッセイ[2]はどれも珠玉の出来で評判ですが、それらを読んでもわかるとおり、HTMXは「Webはこうあるべき」という主義主張のあるライブラリです。その主義主張のかなり初歩的な前提を書きたいと思います。 Reactはなぜだめか、という話です。 21日追記ちょっと誤解が生じているために書き足しますが、Reactのパフォーマンス(及びそれ以外のこと)への批判というのはHTMX固有のものではありません。SvelteやSolidJSといった新興JSフレームワークやRails等の非JS WEBフレームワーク、SSG開発者たち、それからReact開発者たち自身といった多様なWEB開発者たちに共有されている見方です。この記事の最後の方でReact批判記事のリンク集を引用していますが、そういった多様なバックボーンの人た

amautt 2024/03/19

jQuery

リンク

CSSで実装する次のコンテンツへと促すスクロールダウンのラインアニメーション | NxWorld

ファーストビューで大きめのイメージやムービーなどを配置しているサイトでよく見る、次セクションへスクロールするよう促すラインアニメーションをCSSで表現したサンプルです。以前にもスクロールを促す要素として矢印・サークル・マウスなどをCSSで表現する実装コードを紹介しましたが、最近はこのタイプの実装要望が多いので自分用に一覧化したものをシェアします。これといってユニークな動きでもなく基本的には同じような動きになりますが、汎用的に使えそうなもの7タイプです。見栄えも動きもすべてCSSで表現しているため、カラー・サイズ・スピードなど自分好みにいろいろと変更するのも容易だと思います。共通のHTML・CSS 以下で紹介している内容は、すべて下記のようなHTMLを使用しています。 CSSはa要素とその擬似要素への共通スタイルとして下記を記述しています。 a要素にいろいろとスタイル指定はしてありま

amautt 2021/02/23

リンク

JavaScriptのIntersectionObserverを使って可視領域に入った要素をふわっと表示させる | ブログ | 静岡県のホームページ制作 | 6666666 セブンシックス

セブンシックスのダイチです。画面をスクロールして可視領域に入ると、要素がフワッと出てくるやつ、ありますよね。それを、JavaScriptのIntersection Observer APIを使ってやってみよう！というのが今回のお話です。あらすじ私はこれまで、要素をふわっと出すやつには「Emergence.js」というライブラリを好んで使っていました。軽量かつjQuery不要のライブラリです。Emergence.jsに不便は感じていなかったのですが、心情的にスクロールイベントよりもIntersection Observer APIを使いたかったので、代替ライブラリを探すことにしました。良さそうなライブラリが見つからないまま、ヒットしたJavaScriptの解説記事ばかり読んでるうちに、自分で書いたほうが早いということに気が付きました。おい。やりたいことスクロールして要素が画面内に入っ

amautt 2021/02/05

リンク

jQueryで文字列の分割 | 私的雑録

// ハイフンで分割 var str = '03-1234-5678'.split('-'); // str[0] = '03' // str[1] = '1234' // str[2] = '5678' // スペースで分割 var str = 'foo bar baz'.split(/\s+/); var str = 'foo bar baz'.split(/\s+/); // str[0] = 'foo' // str[1] = 'bar' // str[2] = 'baz' // 全角スペースを含む分割 var str = 'foo bar baz'.split(/[\s　]+/); // 日付分割 var str = '2023/06/02 11:23:06'.split(/[\-\/\s:]+/); var str = '2023-06-02 11:23:06'.split(/

amautt 2020/02/08

jQuery

リンク

【PHP】時間帯ごとに表示内容を変更する方法

ホームページの中で、時間帯によって表示内容を変更したい箇所がある場合、PHPを使うことで簡単に解決することができます。 PHP には日付や時間を扱う［date()関数］と呼ばれる機能があるので、それを用いて時間を取得して、朝と夜でサイトのイメージを変えたり、表示しているテキストを変更したりすることが可能です。以下の例では、朝・昼・晩で異なるテキストを表示させています。 <?php $time = intval(date('H')); if (4 <= $time && $time <= 12) { // 4時～12時の時間帯のとき ?> <p>おはようございます。</p> <?php } elseif (12 <= $time && $time <= 20) { // 12時〜20時の時間帯のとき ?> <p>こんにちわ。</p> <?php } else { // それ以外の時間帯のと