WordPress 中的视差

Question

我的页面-parralax.php 文件中有以下视差代码：

get_header(); ?>

<?php
    $args = array(
        'post_type' => 'parallax',
        'order' => 'ASC',
        'orderby' => 'menu_order'
        );
    $parallax = new WP_Query($args);
        while($parallax->have_posts()) : $parallax->the_post();

        $parallaxImage = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'large');
        $breakUrl = str_replace('http://localhost/themes', '', $parallaxImage[0]); ?>

        <div class="wrapper">

    <div class="container">
        <div id="clearfix">
            <section class="parallax" id="section_<?php echo the_ID(); ?>" style="background: url('../<?php echo $breakUrl; ?>') fixed;"></section>
            <section id="section_<?php echo the_ID();?>" class="parallax" style="background: url('../<?php echo $breakUrl; ?>') fixed;"></section>

        <div class="parralax-container">
            <h2><?php the_title(); ?></h2>
            <div class="page-content">
                <?php the_content();?>
            </div>
        </div>
        </div>
    </div>

    </div>
<?php 
    endwhile;
    wp_reset_postdata();
    get_footer(); 
?>

但是当我尝试查看它时，它 returns 出现以下错误：

GET http://localhost/themes/index.php/wp-content/uploads/2015/10/macbook_overview_og-700x700.jpg 404（未找到）每张图片。

如果我之后在控制台中将其更改为：

http://localhost/themes/wp-content/uploads/2015/10/macbook_overview_og-700x700.jpg 显示正确。

是不是因为我使用的是 localhost 导致了这个错误？

Answer 1

你必须去更深上层：

background: url('../..<?= $breakUrl; ?>')

我删除了结尾的斜杠，因为您的 URL 是以它开头的。您也可以考虑设置 <base> URL 并从一开始就使用相关的 URLs。

WordPress 中的视差

Parallax in WordPress

php

wordpress

localhost

parallax