タグ

JavaScriptとCSS3に関するski_yskのブックマーク (4)

  • SketchCode - オフラインで使えるJSFiddle/CodePen/JSBin代替 MOONGIFT

    JSFiddleやCodePenなど、オンライン上でHTML/JavaScript/CSSを書いた結果をすぐに確認できるサービスがあります。非常に便利なサービスなのですが、インターネットに繋がっていないと使えないという欠点があります。 そこで使ってみたいのがSketchCodeです。ローカルで利用でき、さらにGUIアプリケーションというWebコードスニペット実行環境です。 SketchCodeの使い方 メイン画面です。 編集画面です。上からHTML/CSS/JavaScriptとなっています。外部ライブラリを読み込む場合はHTML上に記述する必要があります。 結果は右側のプレビューで確認できます。 保存しておけば幾つも作れます。 SketchCodeはオフラインで使えるので、いつでもどこでも開発できます。ちょっとしたコードを試したり、動作確認ができるでしょう。できあがったコードはオンライン

    SketchCode - オフラインで使えるJSFiddle/CodePen/JSBin代替 MOONGIFT
  • lup - JavaScriptで手軽にCSS3アニメーションを実現

    MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました CSS3でアニメーションが追加されたとは言え、効果的に実装するのは色々面倒です。そのため、分かってはいつつもなかなか手出しできないという人は多いのでは内でしょうか。 そんな方に使ってみて欲しいのがlupです。jQuery風に簡単な指定を使ってアニメーションできるJavaScriptライブラリです。 lupの使い方 一例です。色が刻々と変わっているのが分かるでしょうか。 実際の指定です。addを使って色を指定し、waitを使って一定時間そのまま停止します。そしてthen()を使って実行し、最後にend()を実行すると停止します。 lup("#test").add('green').wait(2000).remove().add('red').wait(2000).then().end

    lup - JavaScriptで手軽にCSS3アニメーションを実現
  • くるくる回る巻きすのようなアニメーション·Makisu MOONGIFT

    MakisuはCSS/JavaScriptを使って巻きすのようなアニメーションを行うライブラリです。 Makisuの面白さはあえて語らず、そのアクションを実際に見てもらうのが良さそうです。以下よりぜひ! パタパタと広がっていくのが印象的です。 広げることも逆に折り畳むこともできます。 デモ動画です。 CSS 3Dがサポートされていないといけないので、Operaは使えずIEも10以上から対応となっています。ソフトウェア名通り、巻きすのようにパタパタと折り畳まれていく様子は面白いです。最後の1回だけ逆側に折り畳まれるので、メニューのヘッダーが見えているというのも細かく気が配られています。 MakisuはJavaScript製、MIT Licenseのオープンソース・ソフトウェアです。 MOONGIFTはこう見る HTML5によってユーザ体験をどれくらい変えられるのか、既存のHTML4を捨ててま

  • IDEA * IDEA

    ドットインストール代表のライフハックブログ

    IDEA * IDEA
  • 1