私はPHPを初めて使い慣れているので、既成のスクリプトをカスタマイズすることはまだ非常に難しいことです。DIVが存在するかどうかを示すPHPカスタマイゼーションモジュール
私はアニメーションポップアップモーダルスクリプトを持っています。これは現在、特定のものがクリックされたときに起動します。私はまた、特定のdivがページに存在するときに、この同じスクリプトを自動的に起動したいと思います。
#maskは、コードからわかるように、ページ上に黒い半透明のレイヤーです。
ここで私は調整する必要があるスクリプトです:
<a href="#" name="modal">
そして、私はときに、このことを自動的に実行するために取得しようとしている:このリンクをクリックしたときに
$(document).ready(function() {
//select all the a tag with name equal to modal
$('a[name=modal]').click(function(e) {
//Cancel the link behavior
e.preventDefault();
//Get the A tag
var id = $(this).attr('href');
//Get the screen height and width
var maskHeight = $(document).height();
var maskWidth = $(window).width();
//Set height and width to mask to fill up the whole screen
$('#mask').css({'width':maskWidth,'height':maskHeight});
//transition effect
$('#mask').fadeIn(1000);
$('#mask').fadeTo("slow",0.8);
//Get the window height and width
var winH = $(window).height();
var winW = $(window).width();
//Set the popup window to center
$(id).css('top', winH/2-$(id).height()/2);
$(id).css('left', winW/2-$(id).width()/2);
//transition effect
$(id).fadeIn(2000);
});
});
は現在、それが自動的に開きますDIVは、ページ上に存在する:
<div name="showintrovideo"></div>
本当にありがとうございましたみんな、あなたは常に、このような大きな助けです! -
- アンドリュー
EDITここ
は、私が働いている完全なコードです:
HTML
<div id="boxes">
<div id="qrcodemarketing" class="window">
<!-- close button is defined as close class -->
<div style="float:right;">
<a href="#" class="close"><img src="images/close_window.png" width="22"height="22" alt="Close Window" /></a>
</div>
<iframe width="640" height="480" src="http://www.youtube.com/embed/MYVIDEO" frameborder="0" allowfullscreen></iframe><br /><b>Pause the video before closing this window</b>
</div>
</div>
<!-- Do not remove div#mask, because you'll need it to fill the whole screen -->
<div id="mask"></div>
CSS
#mask {
position:absolute;
width:100%;
height:100%;
left:0;
top:0;
z-index:9000;
background-color:#000;
display:none;
}
#boxes .window {
position:absolute;
background:none;
display:none;
z-index:9999;
padding:20px;
color:#fff;
}
の
.jsファイルは、それはそれはまた、クリックすると自動的に開くだけでなく、できるように、単に.jsファイルを微調整することができ、それ
$(document).ready(function() {
//select all the a tag with name equal to modal
$('a[name=modal]').click(function(e) {
//Cancel the link behavior
e.preventDefault();
//Get the A tag
var id = $(this).attr('href');
//Get the screen height and width
var maskHeight = $(document).height();
var maskWidth = $(window).width();
//Set height and width to mask to fill up the whole screen
$('#mask').css({'width':maskWidth,'height':maskHeight});
//transition effect
$('#mask').fadeIn(1000);
$('#mask').fadeTo("slow",0.8);
//Get the window height and width
var winH = $(window).height();
var winW = $(window).width();
//Set the popup window to center
$(id).css('top', winH/2-$(id).height()/2);
$(id).css('left', winW/2-$(id).width()/2);
//transition effect
$(id).fadeIn(2000);
});
//if close button is clicked
$('.window .close').click(function (e) {
//Cancel the link behavior
e.preventDefault();
$('#mask, .window').hide();
});
//if mask is clicked
$('#mask').click(function() {
$(this).hide();
$('.window').hide();
});
});
を提出しますか?
ありがとうございます!
解決してくれてありがとう、マーティン! また、私はこの新人だから、自分のソースコード(私は質問に追加したもの)を見て、自動開封と開封の両方のためにそれを調整する方法を知りたいですか? あなたのソリューションをどのように統合するか分かりません。私の欠点を許してください。 乾杯! – Andrew