私が取り組んでいる何かのために助けが必要です。私は webapp の設計を行っており、クライアントがコンテンツを追加すると、ポップアップ (IOS のようなもの) がアイコンに表示され (デザインは線の付いたアイコンに基づいています)、残っている更新の数を示します。
さて、主な問題は次のようになります。私は cookie.js を使用してホーム画面に更新アイコンを設定しています。コードを変更して、画像内をクリックしたときにのみアイコンが消えるようにしました。正常に動作しますが、他のページ (つまり、他のアイコンをクリックしたとき) に更新ポップアップが表示されるという問題があります。
他のページでその更新ポップアップを非表示にするにはどうすればよいですか? メインアイコン(ポップアップを削除するアイコン)をクリックするまで、まだ表示されているためです。
JS コード
<script type="text/javascript">
var popupStatus = 0;
//loading popup with jQuery magic!
function loadPopup(){
//loads popup only if it is disabled
if(popupStatus==0){
$("#backgroundPopup").css({
"opacity": "0.7"
});
$("#backgroundPopup").fadeIn("slow");
$("#popupContact").fadeIn("slow");
popupStatus = 1;
}
}
//disabling popup with jQuery magic!
function disablePopup(){
//disables popup only if it is enabled
if(popupStatus==1){
$("#backgroundPopup").fadeOut(0.0000000000001);
$("#popupContact").fadeOut(0.0000000000001);
popupStatus = 0;
}
}
//centering popup
function centerPopup(){
//request data for centering
var windowWidth = document.documentElement.clientWidth;
var windowHeight = document.documentElement.clientHeight;
var windowscrolltop = document.documentElement.scrollTop;
var windowscrollleft = document.documentElement.scrollLeft;
var popupHeight = $("#popupContact").height();
var popupWidth = $("#popupContact").width();
var toppos = windowHeight/2-popupHeight/2+windowscrolltop;
var leftpos = windowWidth/2-popupWidth/2+windowscrollleft;
//centering
$("#popupContact").css({
});
//only need force for IE6
$("#backgroundPopup").css({
"height": windowHeight
});
$("#popupContact").click(function () {
$("div").hide(0.000000000001);
});
}
//CONTROLLING EVENTS IN jQuery
$(document).ready(function(){
if ($.cookie("anewsletter") != 1) {
//load popup
setTimeout("loadPopup()",0.001);
}
//CLOSING POPUP
//Click the x event!
$("#popupContactClose").click(function(){
disablePopup();
$.cookie("anewsletter", "1", { expires: 7 });
});
//Click out event!
$("#pop").click(function(){
disablePopup();
$.cookie("anewsletter", "1", { expires: 7 });
});
//Press Escape event!
$(document).keypress(function(e){
if(e.keyCode==27 && popupStatus==1){
disablePopup();
$.cookie("anewsletter", "1", { expires: 7 });
}
});
});
</script>
HTML
<div class="imatge">
<div class="imatges" id="hide"><a href="promos.html"><img src="Promociones.png" alt="Promociones" border="0"></a></div>
<div class="imatges"><a href="novedades.html"><img src="Novedades.png" alt="Novedades" border="0"></a></div>
<div class="imatges" id="pop">
<a href="actualizacion.html"><img src="actprod.png" alt="Actproducto" border="0"></a>
<div id="popupContact"></div>
</div>
<div class="imatges"><a href="http://anubis-cosmetics.com/news/indexapp.html"><img src="newsletter.png" alt="Newsletter" border="0"></a></div>
<div class="imatges"><a href="http://www.blog.anubis-cosmetics.com"><img src="Blog.png" alt="Blog" border="0"></a></div>
<div class="imatges"><a href="agenda.html"><img src="Agenda.png" alt="Agenda" border="0"></a></div>
<div class="imatges"><a href="sugerencias.html"><img src="sugerencias.png" alt="Sugerencias" border="0"></a></div>
<div class="imatges"><a href="contacto.html"><img src="Contacto.png" alt="Contacto" border="0"></a></div>
<div class="imatges"><a href="socialmedia.html"><img src="socialmedia.png" alt="socialmedia" border="0"></a></div>
</div>
Jqueryで他のページに隠そうとさえしました
<script>
$(".imatges").hide();
$("#popupContact").click(function ( event ) {
event.preventDefault();
$(this).hide();
});
</script>
しかし、うまくいきませんでした...
私はあなたの助けに感謝します、ありがとう