Build a custom fade in fade out slideshow
In my previous blog post, I provided a step by step tutorial on how to build a custom image slider into your WordPress. This was achieve by using Nathan’s awesome slideshow plugin. Digging a bit deeper in his code and website, I discovered that he’s also included fade in fade out transition.
If you’ve downloaded the material, took a stab at the tutorial and wish to use this transition effect instead of a slider action, all you need to do is replace the jQuery function in your header with the following:
<script> jQuery(document).ready(function($){ $('#slides').slides({ preload: true, preloadImage: 'http://yourthemepath.com/images/loading.gif', effect: 'fade', play:5000, crossfade: true, fadeSpeed: 500, generatePagination: false }); }); </script>
You also no longer need the next and previous arrows.