ソーシャルメディアのアイコンをCSSとHTMLだけで作ってしまった「Experimental: Pure CSS social media icons」というエントリーのご紹介。
IE系では動作しないようですが、面白いサンプルがありました。
詳しくは以下
Androidからサイトの開発やデバッグを行えるアプリをまとめた「5 Free Android Apps for Web Developers」というエントリーのご紹介。
HTMLのソースの確認やFTP接続などをAndoroidから実行できるようです。
※ Androidの実機を持っていないので、動作確認はしておりません。
詳しくは以下
- 2010/02/10 Google Map , html , jquery , jQuery Plugin , 回転
Animate CSS Rotation and Scaleを使用すると、どんなHTMLでも回転させる事ができるようになります。
って、どこで使うんだろう。誰かのヒントになればって事でご紹介。
使い方
まずは、jQueryとプラグインを読み込みます。
<script src="jquery.js" type="text/javascript"></script> <script src="jquery-css-transform.js" type="text/javascript"></script> <script src="jquery-animate-css-rotate-scale.js" type="text/javascript"></script>
その後に、プラグインを有効化すれば動作するようです。
<script>
setInterval(
function () {
$('#at_ex1').animate({rotate: '+=10deg'}, 0);
},
200
);
$('#at_ex1').click(
function () {
$(this).animate({scale: '+=0.33'}, {queue: false, duration: 1000});
}
);
</script>
Google Mapを回転させる
このプラグインを使ってGoogleMapを回転させている方がいました。
デモはこちら
‘L’と’R'キーを使用して、地図を回転させる事ができます。
こんな事もできるんですね。
ちょっと便利だと思ったのでエントリー。PrimerCSSはCSSを作成する際に必要な class指定やid指定をhtmlから抜き出してくれるWEBサービスです。
例えば以下のようなhtmlを入力してみます。
logohogehoge
するとCSSに必要な要素のみを抽出して表示してくれるのです。
/* CSS Generated by Primer - primercss.com */
div#container {
}
div#header {
}
div#content {
}
div#main {
}
div.clearer {
}
div#footer {
}
p.copyright {
}
これは使い方によっては結構便利かもしれません。
興味がある方はぜひ使ってみてください。
0