我一直在寻找谷歌并测试各种WP插件,但我找不到具体做我需要它的那些。
我正在寻找一种能够像传送带一样旋转帖子,页面和/或图像的滑块。到目前为止,我能找到的最接近的是一个后置一个后出系统。
我愿意尝试自己创建一个滑块,但我的JS知识很差。我觉得好像我可能需要调整一个非常小的设置来实现这一点,但我已经碰到了一堵砖墙。
非常感谢任何帮助。
<div class="slideshow">
<?php $thumb = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'full' );?>
<div class="slide first" style="background-image: url('<?php echo $thumb['0'];?>')">
<?php the_title(); ?>
</div>
<?php $slideshowPosts = new WP_Query('showposts=10&orderby=rand&posts_per_page=5');
if ($slideshowPosts -> have_posts()):
while ($slideshowPosts -> have_posts()) : $slideshowPosts -> the_post(); ?>
<!-- instruction -->
<?php $thumb = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'full' );?>
<div class="slide rest" style="background-image: url('<?php echo $thumb['0'];?>')">
<?php the_title(); ?>
</div>
<!-- end instruction -->
<?php endwhile;
else :
echo '<p>No content found</p>';
endif;
wp_reset_postdata(); ?>
</div>
.slideshow {
height:240px;
overflow:hidden;
height:240px;
width:3200px;
}
div.slide {
height:240px;
width:400px;
float:left;
}
.rest {
-webkit-animation: bannermove 30s linear infinite;
animation-delay: 5s;
-webkit-transition: all 0.5s ease;
}
.first {
-webkit-animation: bannermove 30s linear infinite;
}
@-webkit-keyframes "bannermove" {
0% {margin-left: 0px;}
100% {margin-left: -2125px;}
}
答案 0 :(得分:1)
我总是在我的网站上使用Revolution Slider。 它没有限制,我相信你会在其中找到你想要的东西。
答案 1 :(得分:1)
所以我猜你已经尝试了https://en-au.wordpress.org/plugins/image-slider-widget/screenshots/
我认为使用tweats可以自动旋转。
但如果你看js,你可能会发现下面有趣的
http://www.jqueryscript.net/slideshow/jQuery-Auto-Rotating-Image-Slider-with-CSS3-Wipe-Effect.html
答案 2 :(得分:0)
您可以使用“旋转”滑块。这是一个很棒的WordPress Slider插件。您几乎可以创建任何想要的东西。