这个问题更像是一个js/jQuery,而不是WordPress。我不会发布一个有效的答案,因为很难阅读给出的html。我认为你现在的做法并不是一个有效的解决方案。我的回答应该会引导你找到更好的解决方案。
首先,您不需要淡入弹出窗口中的所有元素。仅在父元素中淡入并隐藏父元素。
If popup html parent is like this:
<div class="popup" style="display:none">
<!-- all child element here-->
</div>
Js for this should be like
$(\'.popup\').fadeIn(500);
对我来说,我只会在页脚中输出一次弹出式html。然后在单击特定的post元素时动态更新弹出的html。
For example
<div id="popup" style="display:none">
<a class="facebook" href="#">Share in facebook</a>
<a class="twitter" href="#">Share in Twitter</a>
</div>
单击时,我将在循环中放置链接以启动弹出窗口
<a class="share_link" href="#" data-permalink="<?php the_permalink(); ?>" data-id="<?php the_ID(); ?>" data-title="<?php the_title(); ?>">Click to Share</a>
在中单击时更新弹出窗口的js代码示例
share_link
锚定元件
$(\'.share_link\').click(function(){
var $this = $(this);
// gather data
var permalink = $this.data(\'permalink\');
var id = $this.data(\'id\');
var title = $this.data(\'title\');
// update popup
$popup = $(\'#popup\');
$popup.find(\'.facebook\').attr(\'href\', facebook_share_link(permalink, title));
$popup.find(\'.twitter\').attr(\'href\', twitter_share_link(permalink, title));
// show the popup
$popup.fadeIn(500);
});
var facebook_share_link = function(permalink, title){
// generate the appropriate link to facebook
}
var twitter_share_link = function(permalink, title){
// generate the appropriate link to twitter
}
希望这有帮助。