【jQuery】指定の要素数毎に自動で「続きを読む」ボタンを生成 | LIOT BLOG
使い所がかなり限られるコードですが、たとえば1ページ内に同じ要素をリストで大量に並べるときに、ユーザーに分割して見せたい場合などに使えそうなコードを共有します。 指定した要素の数ごとに少しずつ表示させます。自動で追加される「続きを読む」ボタンを押せば、分割した数ごとに順次表示されるようになります。 DEMO まず詳しい動きについては下記の動作デモページを用意しましたのでご確認ください。jQuery本体のバージョンは3.3.1を使用しているので、古いバージョンによっては動かない可能性もあります。 » 動作デモページはこちら 動作デモページではリスト要素を3件ずつ自動で分割するようになっています。このあとご紹介するコードをそれぞれ順番にコピーして、ご自分の環境に合わせて修正してみてください。（またはデモページのソースをそのままコピーしてください。） 設置方法jQuery本体の読み込みCDNで配
lazylinepainterをつかって簡単SVGアニメーション
BLOG SVGアニメーションといえばCSSのみでもいけますよね？ 例えばこんな感じで( -`д-´)ｷﾘｯ <style> #cloud { stroke: salmon; stroke-dasharray: 2000; stroke-dashoffset: 2000; stroke-width: 2; -webkit-animation: cloud_line 10s linear 0s infinite; animation: cloud_line 10s linear 0s infinite; } @keyframes cloud_line { 0% { stroke-dashoffset: 2000; } 100% { stroke-dashoffset: 0; } } @-webkit-keyframes cloud_line { 0% { stroke-dashoffset:
HTMLのインデント、連続する半角スペース、改行を取り除くJavaScript - TakiTakeの日記
改行がスペースになったり、連続したスペースは１文字扱いだったりとややこしいレンダリング周り。さらに、ブラウザ間で差があるから発狂物。どのブラウザで見ても同じにしたい。スペース１つが命取りな場合もある。なんとかしたい！ そんなことは、サーバ側でやれよ。って話ですが、UserScriptでゴニョゴニョしたいときはjavascriptでがんばるしかないので、なんとかしてみました。 JavaScript版 var b = document.body; // body.innerHTMLを１行ごと配列に格納 var l = b.innerHTML.split("\n"); for (var i = 0, j = l.length; i < j; i++) { // 前後の空白文字を取り除く // 連続する半角スペースを１つにまとめる l[i] = l[i].replace(/^\s+|\s+$/g,
Javascriptで数値の先頭のゼロを削除する方法と、数字の先頭にゼロつける方法
2012-10-07 643 1581 例えば「01」や「02」など、先頭にゼロがついている数値を「1」という数値に直す場合は、Number関数を使用します。 var str = "05"; var num = Number(str); //結果 num == 5 逆に決まった桁数で先頭にゼロをつけなければいけないケース（ゼロパディング）もよく出くわします。その場合は下記の方法がおそらく最短コード。 var num = 5; var str = ('0' + num).slice(-2); //結果 str == '05' slice関数を使うとスマートにゼロパディングができます。先頭にゼロをつけて、右から2桁だけ取得するという動作をしています。 ＜javascriptゼロパディングのユーザー定義関数＞ ゼロパディングはそこそこ使うことがあるので、関数化しておくと便利です。 //ゼロパディ
Direction-aware 3D hover effect (Concept)
About HTML Preprocessors HTML preprocessors can make writing HTML more powerful or convenient. For instance, Markdown is designed to be easier to write and read for text documents and you could write a loop in Pug. Learn more · Versions Adding Classes In CodePen, whatever you write in the HTML editor is what goes within the <body> tags in a basic HTML5 template. So you don't have access to higher-
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
inview.jsでスクロールして表示されたらアニメーションを実行する-サンプル付き｜Gimmick log
solidstate.jp