ネタが無くなったKameです。
オレサス第2弾ということで、Sassの普及に向けて書いていきます。
普及とか上から目線で言ってますが、僕もあんまり難しいことはできません。
Sassは常々CSS Spriteに強いなーと思っていたので、それ用のコードをちょっと書いてみました。
なんかこう順を追って作っていくみたいな方式でいきます。
ネタが無くなったKameです。
オレサス第2弾ということで、Sassの普及に向けて書いていきます。
普及とか上から目線で言ってますが、僕もあんまり難しいことはできません。
Sassは常々CSS Spriteに強いなーと思っていたので、それ用のコードをちょっと書いてみました。
なんかこう順を追って作っていくみたいな方式でいきます。
ぐへへっ!「人としてポンコツ」と言われたKameです。
普段からSassを使っておりますが、珍獣流のSassの利用法みたいなのを晒してみたいと思います。
あんまりかっこいいもんじゃないです。
こうしたほうがいいとかこれ非効率じゃね?みたいなのがあったらドシドシ叫んでください。
ストクロをやりすぎてしまったKameです。
短期集中単発集やっていきます。
まずはgit fetchをちゃんと調べなくてはと思い、色々やってみました。
ただいま社内のJSライブラリを作ろうという動きがあります。
それを勝手にqriptotypeと名付けているのですが(qQueryとのせめぎ合い)、オレオレプラグイン集を作ろうということでそれをLooToolsと名付けました!!
オレオレプラグイン集を作ってqriptotypeに還元できたらいいのですがね~。
まずは手始めにjQueryに依存しないロールオーバーのコードを書いてみることにしました。
とはいえ参考にしたソースがあるのですが。
2012年11月30日にコードを編集
(function(window) { if ((navigator.userAgent.indexOf('iPhone') > 0 && navigator.userAgent.indexOf('iPad') > 0) || (navigator.userAgent.indexOf('Android') > 0 && navigator.userAgent.indexOf('Mobile') == -1 )||(navigator.userAgent.indexOf('Android') == -1 && navigator.userAgent.indexOf('iPhone') == -1 )) { var rollover = function() { if(document.getElementsByTagName) { var img = document.getElementsByTagName('img'), preImg = []; for (var i=-1,j=-1,n=img.length; ++i < n;) { if (img[i].getAttribute('src').match(/_off\./)) { preImg[++j] = new Image(); preImg[j].src = img[i].getAttribute("src").replace("_off.", "_on."); img[i].onmouseover = function() { this.setAttribute('src', this.getAttribute('src').replace('_off.', '_on.')); }; img[i].onmouseout = function() { this.setAttribute('src', this.getAttribute('src').replace('_on.', '_off.')); }; } } } }; if(window.addEventListener) { window.addEventListener("load", rollover, false); } else if(window.attachEvent) { window.attachEvent("onload", rollover); } } }(window));
続きを読む qriptotype(仮称)に対抗してLooTools!!!!…に組み込むための画像ロールオーバーのコードを書いてみた