文字がピョンピョンとランダムで跳ねる文字効果を JavaScript と CSS を使って作ってみます。 文字をランダムで選択するところで JavaScript を使い、飛び跳ねるアニメーション自体は CSS に任せています。 文字をピョンピョンさせてみる function randomCharactor(c) { //跳ねさせる要素をすべて取得 var randomChar = document.getElementsByClassName(c); //for で総当たり for (var i = 0; i < randomChar.length; i++) { //クロージャー (function(i) { //i 番目の要素、テキスト内容、文字列の長さを取得 var randomCharI = randomChar[i]; var randomCharIText = randomCh
2016年11月24日 JavaScript, jQuery, SVG 今やCSSだけでも多彩なアニメーションを取り入れることができますが、JavaScriptとSVGを使うことで、より美しく自由度のきく表現が可能です。今回はSVGを使った、便利なJavaScriptライブラリーやjQueryプラグインを紹介します。 ↑私が10年以上利用している会計ソフト! ラインアート 1. DrawSVG See the Pen Simple usage by Leonardo Santos (@lcdsantos) on CodePen. Webサイト|GitHub|デモ SVGのパスを使ってラインをアニメーションさせるためのプラグイン。2kbと軽量です。デモ画面右下の「RETURN」ボタンをクリックして試してみてください。 var mySVG = $('#my_svg_element').draw
fukasawaです。こんにちは。 クナイプのグーテナハトが安眠に良いと聞いたので試してみたのですが、風呂場中にタイカレーのようなスパイシーな香りが広がりました。安眠…? Animate.cssは要素にclassをつけるだけで、簡単にいろいろな種類のCSS3アニメーションを実装してくれる便利なスタイルシートです。多くのブログで既に紹介されているものではあるのですが、バシャログではまだ誰も書いていないようなのでここぞとばかりに書いてみます。 公式サイト(デモ&ダウンロード) http://daneden.github.io/animate.css/ GitHub(使い方など) https://github.com/daneden/animate.css ※CSS3アニメーションに対応しているブラウザで動作します。 簡単な使い方 animate.min.cssを読み込みます。 <head> <
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く