Changeset 20546

Timestamp:

2011/03/07 17:43:06 (13 years ago)

Author:

pineray

Message:

refs #1062
お気に入りに登録した際、その旨のTipsをボタンのまわりに表示するように変更。

Location:

branches/version-2_5-dev

Files:

• data/Smarty/templates/default/products/detail.tpl (modified) (1 diff)
• data/class/pages/products/LC_Page_Products_Detail.php (modified) (1 diff)
• html/js/jquery.tipsy.js (added)
• html/user_data/packages/default/css/common.css (modified) (1 diff)
• html/user_data/packages/default/img/ajax/tipsy.gif (added)

branches/version-2_5-dev/data/Smarty/templates/default/products/detail.tpl

@@ -250 +250 @@
                     <!--{/if}-->
                     <!--{if !$is_favorite}-->
-                        <a href="javascript:fnModeSubmit('add_favorite','favorite_product_id','<!--{$arrProduct.product_id|h}-->');" onmouseover="chgImg('<!--{$TPL_URLPATH}-->img/button/btn_add_favorite_on.jpg','add_favolite_product');" onmouseout="chgImg('<!--{$TPL_URLPATH}-->img/button/btn_add_favorite.jpg','add_favolite_product');"><img src="<!--{$TPL_URLPATH}-->img/button/btn_add_favorite.jpg" alt="お気に入りに追加" name="add_favolite_product" id="add_favolite_product" /></a>
+                        <a href="javascript:fnModeSubmit('add_favorite','favorite_product_id','<!--{$arrProduct.product_id|h}-->');" onmouseover="chgImg('<!--{$TPL_URLPATH}-->img/button/btn_add_favorite_on.jpg','add_favorite_product');" onmouseout="chgImg('<!--{$TPL_URLPATH}-->img/button/btn_add_favorite.jpg','add_favorite_product');"><img src="<!--{$TPL_URLPATH}-->img/button/btn_add_favorite.jpg" alt="お気に入りに追加" name="add_favorite_product" id="add_favorite_product" /></a>
                     <!--{else}-->
-                        <img src="<!--{$TPL_URLPATH}-->img/button/btn_add_favorite_on.jpg" alt="お気に入り登録済" name="add_favolite_product" id="add_favolite_product" />
+                        <img src="<!--{$TPL_URLPATH}-->img/button/btn_add_favorite_on.jpg" alt="お気に入り登録済" name="add_favorite_product" id="add_favorite_product" />
+                        <script type="text/javascript" src="<!--{$smarty.const.ROOT_URLPATH}-->js/jquery.tipsy.js"></script>
+                        <script type="text/javascript">
+                            var favoriteButton = $("#add_favorite_product");
+                            favoriteButton.tipsy({gravity: $.fn.tipsy.autoNS, fallback: "お気に入りに登録済み", fade: true });
+                            
+                            <!--{if $just_added_favorite == true}-->
+                            favoriteButton.load(function(){$(this).tipsy("show")});
+                            $(function(){
+                                var tid = setTimeout('favoriteButton.tipsy("hide")',5000);
+                            });
+                            <!--{/if}-->
+                        </script>
                     <!--{/if}-->
                 </div>

branches/version-2_5-dev/data/class/pages/products/LC_Page_Products_Detail.php

@@ -524 +524 @@
                 $objQuery->commit();
             }
+            // お気に入りに登録したことを示すフラグ
+            $this->just_added_favorite = true;
             return true;
         }

branches/version-2_5-dev/html/user_data/packages/default/css/common.css

@@ -410 +410 @@
     font-size: 140%;
 }
+
+
+/* Tipsy
+----------------------------------------------- */
+.tipsy { padding: 5px; font-size: 10px; position: absolute; z-index: 100000; }
+  .tipsy-inner { padding: 5px 8px 4px 8px; background-color: black; color: white; max-width: 200px; text-align: center; }
+  .tipsy-inner { border-radius: 3px; -moz-border-radius:3px; -webkit-border-radius:3px; }
+  .tipsy-arrow { position: absolute; background: url('../img/ajax/tipsy.gif') no-repeat top left; width: 9px; height: 5px; }
+  .tipsy-n .tipsy-arrow { top: 0; left: 50%; margin-left: -4px; }
+    .tipsy-nw .tipsy-arrow { top: 0; left: 10px; }
+    .tipsy-ne .tipsy-arrow { top: 0; right: 10px; }
+  .tipsy-s .tipsy-arrow { bottom: 0; left: 50%; margin-left: -4px; background-position: bottom left; }
+    .tipsy-sw .tipsy-arrow { bottom: 0; left: 10px; background-position: bottom left; }
+    .tipsy-se .tipsy-arrow { bottom: 0; right: 10px; background-position: bottom left; }
+  .tipsy-e .tipsy-arrow { top: 50%; margin-top: -4px; right: 0; width: 5px; height: 9px; background-position: top right; }
+  .tipsy-w .tipsy-arrow { top: 50%; margin-top: -4px; left: 0; width: 5px; height: 9px; }
+