I’ve struggled to find references to this online, but heard the name used multiple times this year when describing the approach outlined here. To the best of my knowledge, the "Component Islands" pattern was coined by Etsy's frontend architect Katie Sylor-Miller during a meeting we had in 2019. The general idea of an “Islands” architecture is deceptively simple: render HTML pages on the server, an
GitHub - alejandromur/shyheader: A simple, light-weight and easy-to-use jQuery Plugin that shows/hides the header of the page when users scroll the page down more than its height. However, the header remains watching the page so when users scroll the page up its being showed. すぐ隠れてくれるヘッダー実装「shyheader」。 ページ表示時に表示されてスクロールで消えて上スクロールでうっすら現れるというヘッダーが実装できます 関連エントリ 超カッコいいスクロールエフェクト実装「lax.js」 スクロール量をページトッ
Jmap jQuery plugin 日本地図 jQuery プラグイン - Released under the MIT license Jmap jQuery pluginは、情報配信に適したシンプルな形状の日本地図を表示することができます。 出力される地図はHTMLコーダーやCSSデザイナーも気軽に利用できるようHTMLとCSSのシンプルな構造となっており、カスタマイズ性に優れかつ便利な機能を複数備えています。
jquery.graphviz.svg - GraphvizのSVGデータを表示/機能追加するjQueryプラグイン MOONGIFT
チャートやネットワーク図などを描くのに使われるのがGraphvizです。多くの場合PNGなどの画像で出力して利用しますが、SVGへのエクスポートも可能です。Web向けであれば、画像よりも使い勝手が良いでしょう。 そんなGraphvizで出力したSVGを表示するのがjquery.graphviz.svgです。 jquery.graphviz.svgの使い方 表示しました。 ノードをクリックすると、ハイライト表示されます。 さらにズームイン/アウトができます。 jquery.graphviz.svgはGraphvizのSVGデータに対して、ハイライトとズームイン、ズームアウトを追加します。さらにデータをレスポンシブにしてくれるので、どのデバイスに対しても適切な表示が可能です。 jquery.graphviz.svgはjQuery/JavaScript製のオープンソース・ソフトウェア（MIT L
There are too many packages and too many dependencies, too deeply nested. Can we measure the problem? And what do we do about it? June 29, 2020 TL;DR The npm ecosystem seems unwell. If you are concerned with security, reliability, or long-term maintenance, it is almost impossible to pick a suitable package to use — both because there are 1.3 million packages available, and even if you find one tha
画面内に入ったらYouTubeを自動再生させる方法まずはYouTubeがスクロールして、画面内に入ったら自動的に再生する方法です。 その次の関連動画が出ないようにするためのループ方法はさらに下に書いています。 YouTube自動再生には”YouTubeのAPI”と”inview.js”というjqueryを使います。 ”inview.js”はjQuery Plugin To Play / Stop Youtube Videos On Page Scrollからダウンロードしてください。 手順1：javascript読み込みinview.min.jsとyoutube-inview-autoplay.jsのjavascript読み込みを記述 <script src="https://code.jquery.com/jquery-3.0.0.min.js"></script> <script sr
この記事は クラウドワークス Advent Calendar 2021 の１日目の記事です。 crowdworks.jp でフロントエンドの可能性をやはり模索し続ける @yamanoku です。アドベントカレンダーを今年もやっていきます。去年と引き続き、初日の盛り上げ手としてやっていきます。よろしくおねがいします。 フロントエンド活動の振り返りをしてみよう 去年もフロントエンド活動の振り返りをしてみましたが今年もやっていきます。 報告ができるということは、なんらかの進捗が出ているということだと思います（解釈）。 そして、現時点ではフロントエンド専属チームは存在していませんが、徐々にその役割が見えてきたことがあるのでその報告もさせてもらえればと思います。 それでは、ご覧ください。 全体総括編 #frontend を #jp_frontendに分化 Slack のチャンネル名を変更した話です
そもそもスクロールのガタつきって？IEとEdgeには、スクロールした時に画面をなめらかに表示する「スムーズスクロール」という機能があります。 名前だけ聞くととても便利な機能に思えますが、実はとても厄介なものでもあります。 それが、chromeやFirefoxなどを使っている人に起きるスクロールした時に画面が激しくブレる（ガタガタする）というバグがあり、とても不快で見れたものではありません。 海外ではIEのシェア率は数パーセントなのでバグは無視できるかもしれません（むしろしてる笑）。 でも、日本はIEとEdgeの２つを合わせて１５％もあることから決して無視できません。※2018年8月時点 私たち制作側はこのバグをなんとかしないといけないのです・・・。 ※ブラウザのシェア率、OS、SNSなどの統計を調べたい場合はこちらを参考に！ StatCounter：http://gs.statcounte
世の中の多くのことは時間軸に沿って進んでいます。1日のスケジュールもそうですし、歴史も時間によって進んでいきます。そうした時間ごとに発生するイベントを表示するのに、単なる一覧ではなく、時間軸を使うと分かりやすくなります。 今回紹介するTimespaceは時間ごとに発生するイベントを表示するライブラリです。 Timespaceの使い方 利用しているところです。イベントをクリックしたり、次のイベントに移動するとアニメーションされます。 クリックしたイベントの詳細が下に表示されます。 説明があれば追加で表示されます。 Timespaceは時間ごと、または年ごとなどで表示できます。歴史年表などであれば年ごとでいいでしょうし、数日であれば時間ごとが最適でしょう。こういった表示が最適な場合は限られるので、Timespaceを覚えておくとさっと使えて便利です。 TimespaceはjQuery/Java
ツールバーの「URLまたはノートへのリンク挿入」を選ぶことで、ノートをタイトルから検索することはできる。
I'm certain there are a lot of you out there who are seeing the excitement around Remix and thinking: Ugh, I'm not ready for something new ... stuff changes too fast! I get it! Learning how to solve the same problems but with a different API is exhausting. The worst part is feeling like all the deep knowledge I have with my current tools is now obsolete, and I'm a beginner all over again. That is
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Islands Architecture - JASON Format
すぐ隠れてくれるヘッダー実装「shyheader」:phpspot開発日誌
Jmap - 日本地図簡単表示ライブラリ(jQueryプラグイン)
Worrying about the NPM ecosystem
YouTube動画が画面内に入ったら自動再生とループさせる記述方法
crowdworks.jp のフロントエンド活動を振り返る 2021 - Qiita
IEとEdgeのスクロールのガタつきは楽しくカスタマイズしながら直そう！
)
Timespace - 時間に紐付いたイベントを表示するjQueryライブラリ MOONGIFT
abixTreeList - jQuery Plugin Demo
Not Another Framework!