代码之家  ›  专栏  ›  技术社区  ›  João

本地主机中的WordPress滑块url问题

  •  0
  • João  · 技术社区  · 6 年前

    我正试图根据以下代码在本地主机的wordpress中实现照片滑块:

    https://github.com/devfreelex/sliderdevmean 还有视频 https://www.youtube.com/watch?v=_nSPiKWWmhs

    问题如下:

    在索引页中,我有html代码:

    <article class="slider_item active"  slider-bg="image/slider/slide1.jpg">
    <div class="slider_content">
        <h1>The title</h1>
            <p>Lorem ipsum dolor sit amet, nemo voluptatum accusamus!</p>
    </div>
    

    在jQuery页面中,我有js代码:

    // DEFINE BACKGROUND DO SLIDE
    (function($){
        $('.slider_item').each(function(){
            var sliderBg = $(this).attr('slider-bg');
            $(this).css({'background-image': 'url("http://localhost/wordpress/wp-content/themes/photographysite/"'+sliderBg+')'});
        });
    }(jQuery));
    

    目标是将url传递给CSS

        element.style { background-image: url('http://localhost/wordpress/wp-content/themes/photographysite/image/slider/slide1.jpg');
    

    }

    不工作 http://localhost/wordpress/wp-content/themes/photographysite/image/slider/slide1.jpg 那么,如何将url参数与图像一起传递呢?

    2 回复  |  直到 6 年前
        1
  •  0
  •   Anake.me    6 年前

    我设法复制了这个错误。我做了一些事情来纠正这个问题。


    1) 我加载了 .css .js 通过我的 functions.php 将包含(或创建)每个Wordpress主题的文件。如果您需要帮助,请遵循以下步骤 LINK .


    2) 更改了中的编码 slider.js 使用我的完整本地路径。例如,我的 http://localhost/sliderJSreplica.com/wp-content/themes/twentyseventeen/ 。所以我的全部代码是:

    (function($){
        $('.slider_item').each(function(){
            var sliderBg = $(this).attr('slider-bg');
            $(this).css({'background-image': 'url(http://localhost/sliderJSreplica.com/wp-content/themes/twentyseventeen/'+sliderBg+')'});
        });
    }(jQuery));
    

    请注意我的撇号所在的位置,因为您可能放错了。


    3) 为属性创建HTML标记 slider-bg slider-bg="image/slider/slide1.jpg"> 根据每张幻灯片。


    我希望这对你有用!如果没有,我很乐意通过TeamViewer提供一对一支持来进一步提供帮助。

        2
  •  -1
  •   Anake.me    6 年前

    首先,我认为您可能像我之前一样,在Wordpress中使用jQuery有问题。尝试添加此 variable 在您的 function 并更换所有 $ 具有 j .

    var j = jQuery.noConflict();
    

    其次,请将Wordpress问题提交给 Wordpress Stack Exchange 。这将帮助你更快地找到答案。