2ページ目   #jQuery

a-blog cms 1.3.0b では、JavaScriptが分からない人でもAjax機能を実装する事が簡単に出来る機能が用意されております。その方法を簡単に書いておきますので、よろしければ以下の手順のようにお試し下さい。

サイト内検索した時にリロード無しにメインのコンテンツエリアを書き換える

修正するファイルは、/themes/company3/include/subInfo.html のみで、最初は以下のような感じになっております。

<!-- エントリー検索　開始▼▼ -->
<div id="freewordSearch" class="menuListBox">
	<h2>検索</h2>
	<form action="" method="post" name="searchForm" id="searchForm">
		<input type="text" name="keyword" value="%{KEYWORD}" size="15" />
		<input type="text" name="iebug" value="" style="display:none;" class="iebug" />
		<input type="submit" name="ACMS_POST_2GET" value="検索" />
		<input type="hidden" name="tpl" value="/search.html" />
		<input type="hidden" name="bid" value="%{BID}" />
	</form>
</div>
<!-- エントリー検索　終了▲▲ -->

Lightboxを利用する設定になっていましたが、prototype の利用をやめ、jQueryを利用するようにし、prettyPhoto を利用する事にしてみました。

prettyPhoto では、画面のサイズが小さな時にサイズをあわせて拡大してくれるようで、縦長の画像とかがはみ出してしまう事がないのがよかったかもしれません。デフォルトの角丸をもう少し小さなものにしたいところですね。

確認用サンプル画像

ユーノスロードスター

スマートカブリオ

ニュービートルカブリオレ

jQueryって面白い その1 で、私なりの JQuery の使い方を考えると、やっぱりPHPとの連携というところで、より便利なフォームのインターフェースに使ってみる事になるんじゃないかと思います。

昨日の3時間ほど、今朝1時間ほど、 jQuery って何かというところから勉強を始めてみました。 これは面白い！って事で「その1」です。