EC-CUBE2.13カスタマイズの説明:ロゴにjQueryロールオーバーを適用する

■data/Smarty/templates/default/header.tpl
タグの属性に、class=”j_roll”を追加する。

<div id="logo_area" class="j_roll">
<p id="site_description">EC-CUBE発!世界中を旅して見つけた立方体グルメを立方隊長が直送!</p>
<a href="<!--{$smarty.const.TOP_URLPATH}-->"><img src="<!--{$TPL_URLPATH}-->img/common/logo.gif" alt="<!--{$arrSiteInfo.shop_name|h}-->/<!--{$tpl_title|h}-->" /></a>
</div>

上記コードには記述されていないが、logo_on.gifという画像を新たに作り、logo.gifと同じフォルダ(common)に置くことが必要。

「_on」が付いている画像が初期表示されている場合はロールオーバーは無視される。

画像はプリロードされるので、ロールオーバーの反応がはやい。

▼logo.gif

▼logo_on.gif

============================
2.13カスタマイズ(デフォルト)デモサイト
2.13カスタマイズ(デザインテンプレート適用)デモサイト
2.13レスポンシブWebデザイン(スタンダード)デモサイト
2.13レスポンシブWebデザイン(特集ページ作成版)デモサイト
▼詳細はこちらから
ダウンロードEC-CUBEカスタマイズ
============================