Question

所以我在Wordpress中使用AnythingSlider。这就是我试图从原始帖子中调用缩略图的原因。任何滑块都将配置缩略图导航，如下所示：

function formatText(index, panel) {
  return index + "";
}

$(function () {

    $('.anythingSlider').anythingSlider({
        navigationFormatter: formatText       // Details at the top of the file on this use (advanced use)
    });

});

正如您所看到的，navigationFormatter将允许我格式化导航（包括缩略图），但我想要。例如，要格式化缩略图，我可以这样做：

 navigationFormatter : function(i, panel){ // add thumbnails as navigation links
return '<img src="images/th-slide-' + ['civil-1', 'env-1', 'civil-2', 'env-2'][i - 1] + '.jpg">';

} 所以我的问题是让wordpress幻灯片图像动态显示在那里，而不是在文件夹中显示（如上例所示）。作为参考，这是我的php查询，它提取帖子图片（来自我已经写过的脚本：

    <img class="slider-img" style="float:left;" src="<?php if(function_exists('wp_get_post_image')){ echo wp_get_post_image(array( 'return_html' => false, 'width' => 500 )); } ?>" />

我希望此更新有所帮助。非常感谢你们。 Stack overflow社区很棒！

Answer 1

您可以使用设置anySlider内容的LI的相同循环来设置JS数组，然后在jQuery调用之前回显它，或使用类似的东西：

$thumbArrStr = "[";
foreach($yourThumbData as $k=>$v) {
    $thumbArrStr .= "'$v',";
}
$thumbArrStr = substr($thumbArrStr, 0, -1);
$thumbArrStr .= "]";
echo "var anythingSliderArr = $thumbArrStr;";

现在使用anythingSliderArr：

navigationFormatter : function(i, panel){ // add thumbnails as navigation links
    return '<img src="images/th-slide-' + anythingSliderArr[i - 1] + '.jpg">';
}

Wordpress和Anythingslider导航缩略图

1 个答案: