Wordpress 可湿性粉剂；正在寻找一种向lightbox动态添加内容的方法
我不确定我需要什么样的脚本，希望这里有人知道 在我正在构建的wordpress驱动的博客的主页/归档页面上，我只有一排缩略图（特色图片）。我不希望这些链接到实际的post/页面，而是希望它们触发一个lightbox类型的元素，该元素具有post/页面的描述 从那里，用户可以继续（通过阅读更多）到帖子，或者关闭帖子并继续搜索网格 非常感谢您的任何见解 纯CSS解决方案：Wordpress 可湿性粉剂；正在寻找一种向lightbox动态添加内容的方法,wordpress,lightbox,Wordpress,Lightbox,我不确定我需要什么样的脚本，希望这里有人知道 在我正在构建的wordpress驱动的博客的主页/归档页面上，我只有一排缩略图（特色图片）。我不希望这些链接到实际的post/页面，而是希望它们触发一个lightbox类型的元素，该元素具有post/页面的描述 从那里，用户可以继续（通过阅读更多）到帖子，或者关闭帖子并继续搜索网格 非常感谢您的任何见解 纯CSS解决方案： <body> <div id="featured-grid"> <?php if(have_pos
<body>
<div id="featured-grid">
<?php
if(have_posts()) : while(have_posts()) : the_post();
$default = '<img src="'.get_bloginfo('stylesheet_directory').'/images/default_thumb.jpg">';
$thumb = has_post_thumbnail() ? get_the_post_thumbnail() : $default;
?>
<div class="post-block">
<div class="post-thumb">
<a class="hover-trigger" href="#"><?php echo $thumb; ?></a>
</div>
<div class="post-preview lightbox">
<div class="preview-wrap">
<a class="featured-image" href="<?php the_permalink(); ?>"><?php echo $thumb; ?></a>
<?php the_excerpt(); ?>
</div>
</div>
</div>
<?php
endwhile;endif;
?>
</div>
</body>
<style type="text/css">
.post-block{width:300px;height:300px;}
.post-thumb{width:100%;height:100%;margin:10px;float:left;}
.post-thumb *{display:block;width:100%;height:100%;}
.lightbox{
display:none;
width:100%;
height:100%;
background:rgba(0,0,0,0.4);
position:fixed;
top:0;
left:0;
}
.preview-wrap{width:960px;margin:0 auto;position:relative;top:40px;background:#FFF;}
.post-block:hover .lightbox{display:block;}
.post-block:hover .post-thumb{display:none;}
</style>
.post块{宽度：300px；高度：300px；}
.post thumb{宽度：100%；高度：100%；边距：10px；浮动：左；}
.post thumb*{显示：块；宽度：100%；高度：100%；}
.灯箱{
显示：无；
宽度：100%；
身高：100%；
背景：rgba（0,0,0,0.4）；
位置：固定；
排名：0；
左：0；
}
.预览包裹{宽度：960px；边距：0自动；位置：相对；顶部：40px；背景：#FFF；}
.post块：悬停.lightbox{display:block；}
.post块：悬停.post拇指{显示：无；}