お問合せ

カートのカスタマイズとサンプル２

ショッピングカートには様々なデザインのものがあります。Apple StoreのサイトをヒントにWP-OliveCartでスクロールで追いかけるショッピングカートのサンプルを作ってみました。

shop sample

ポイントはjavascriptでスクロールで移動した場合に、カートの表示位置を同じにすることです。

<script language=”JavaScript”>
offX = 0; //　←メニューの左からの表示位置
offY = -100; //　←メニューの上からの表示位置
window.onscroll =function setMenu()
{
sx = document.body.scrollLeft;
sy = document.body.scrollTop;
if(sy > 100){
right_menu.style.left= sx + offX;
right_menu.style.top = sy + offY;
}
else{
right_menu.style.left= 0;
right_menu.style.top = 0;
}
}
</script>

WP-OliveCart, カスタマイズ | Comments | Trackback