如何通过blur.js(JQuery)模糊_POST_THMBAILE()?

时间:2015-12-06 作者:ezkay

我想使用模糊。js公司(blurjs.com) 模糊帖子缩略图。但似乎是。js无法从\\u post\\u缩略图()中抓取图像。如果我按照网站上的说明,在有背景的情况下构建自己的两个测试div,那就行了!因此,问题是如何从自定义模糊读取的“the\\u post\\u thumbnail()”中获取图像。js。看起来很模糊。js需要背景图像才能工作。

这是我的php文件:

    <?php if ( has_post_thumbnail() ) :?>
    <?php // USE LIGHT BOX OR POST URL in Image
    $useLightBox  =  $shortcodeData[\'wmlo_use_lightbox\'];
    $imageLink    =  get_permalink();        
    if ($useLightBox == \'yes\'):
        $largeImageSrc  = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), \'large\', false, \'\');
        $imageLink      = $largeImageSrc[0]; //Send image path
    endif;  
    // SET $imageLink for feature image a tag
    ?>

    <div class="wpme_image">
    <div class="testtext">asdafsd afsdfdsad sasdaf dsf</div>

    <a href="<?php echo $imageLink; ?>"><div class="testbg"><?php the_post_thumbnail(); ?></div></a>

    </div>
<?php endif; ?><!-- EOF featured image -->
这是一个额外的自定义模糊。js公司:

// Blur.js part of image
// ----------------------------------------------------
    $(\'.testtext\').blurjs({
        source: \'.teeestbg\',
        radius: 10,
        overlay: \'rgba(255,255,255,0.4)\'
    }); // EOF blurjs

1 个回复
最合适的回答,由SO网友:ezkay 整理而成

我想出来了模糊。js需要背景图像才能工作。

我必须将图像单独设置为背景:

<?php $thumb = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), \'full\' );?>
<a href="<?php echo $imageLink; ?>">
    <div class="testbg" style="background-image: url(\'<?php echo $thumb[\'0\'];?>\')">
       <?php the_post_thumbnail(); ?>
    </div>
</a>