articles

2013 年 6 月 29 日

WordPress jQueryを使う際のconflict処理

CATEGORYWordPress  TAG 12:42 PM
これが結構引っかかるんですがカプセル化したり、$を置き換えたり、再利用性がなかったり手間をかけるのは嫌なので一番簡単で、スクリプトを書き換えない方法はないかなーって思ってました。で、一番簡単なのは、wp-include/js/jquery/jquery.jsの
jQuery.noConflict();
をコメントアウトする方法かなと思いました。
//jQuery.noConflict();
テーマによってはって感じですが、いまさら他のライブラリは使わないかなっていうところです。

2010 年 6 月 21 日

jQuery li複数のシミュレーション用

良くレイアウトをCSSで組む際に
リストが複数ある状態をシミュレーションするためにわざわざli要素をコピーとかするんですが
このスクリプトを制作のときに入れておけば楽でした。
li要素を変更したときにも役立ちます。

list='<li>'+$("#sample_list li:first").html()+'</li>';
for(i=0;i<10;i++){
    $("#sample_list ul").append(list);	
}

テスト用なので、稼働時には外しますが。

2010 年 3 月 9 日

jQuery スライドショーでフェードイン、フェードアウト2010

CATEGORYjQuery  TAG 10:16 PM

前々からやってはいましたが、データの形式(配列からJSONに)とコールバックの仕方を変えてシンプルにしたので一応メモっておきます。
もちろんこれだけでは動かず一定間隔ごとにchange()関数を実行する必要があります。

ちなみにJSONは(JavaScript Object Notation)だそうです。


//初期フェーズ
slide_phase=-1;

//データ
pickup_data=new Array();
slide_data[0]={"href":"test_url1.html","comment":"テスト1","img_path":"1.jpg"};
slide_data[1]={"href":"test_url2.html","comment":"テスト2","img_path":"2.jpg"};
slide_data[2]={"href":"test_url3.html","comment":"テスト3","img_path":"3.jpg"};

slide_num=slide_data.length;

function change(){
	if(slide_phase < slide_num-1){
		slide_phase ++;
	}else{
		slide_phase =0;
	}
	$("#slide img").fadeOut(500,changeSrc);
	$("#slide a").attr("href",slide_data[slide_phase].href);
	$("#slide .comment").text(slide_data[slide_phase].comment);
}
//コールバック
// $(this)でイベントが発生したオブジェクトを受け取れる。
function changeSrc(){
	$(this).attr("src", slide_data[slide_phase].img_path).fadeIn(2500);
}

2010 年 3 月 1 日

jQuery aのイベントでリンクさせない処理

CATEGORYEventsjQuery  TAG 5:51 PM

aにclickなどのイベント処理をする場合、hrefのリンク先に飛んでしまうので
困っていました。

例えば、下の処理です。

$(function(){
    $("a").click(function(){
            $("#test_img").attr("src","test.jpg");
    })
})

このような時は関数の返り値をfalseにしてやることで
aがリンクするのを回避する事が出来るそうです。

$(function(){
    $("a").click(function(){
            $("#test_img").attr("src","test.jpg");
            return false;
    })
})

これ、もっと早く知っておきたかったです。