After calling the owl transitions css as mentioned by ricstar with the line of code to add to the slideshow.php, I made a tweak to the original poster's addition and it works like a charm (at least on 2.0.3.1.) A similar solution was mentioned in a related thread about banners, modded to enable fading.
Just above the script in slideshow.tpl, add this....
<?php
$bannertransition="fade";
?>
In the script itself in slideshow.tpl , rather than adding....
transitionStyle: 'fade' as mentioned by the original post
add this instead....
transitionStyle: '<?php echo $bannertransition; ?>'
Works for me anyway.
Slideshow.tpl would then look something like this depending on your other options...
<div id="slideshow<?php echo $module; ?>" class="owl-carousel" style="opacity: 1;">
<?php foreach ($banners as $banner) { ?>
<div class="item">
<?php if ($banner['link']) { ?>
<a href="<?php echo $banner['link']; ?>"><img src="<?php echo $banner['image']; ?>" alt="<?php echo $banner['title']; ?>" class="img-responsive" /></a>
<?php } else { ?>
<img src="<?php echo $banner['image']; ?>" alt="<?php echo $banner['title']; ?>" class="img-responsive" />
<?php } ?>
</div>
<?php } ?>
</div>
<?php
$bannertransition="fade";
?>
<script type="text/javascript"><!--
$('#slideshow<?php echo $module; ?>').owlCarousel({
items: 6,
autoPlay: 5000,
singleItem: true,
navigation: true,
navigationText: ['<i class="fa fa-chevron-left fa-5x"></i>', '<i class="fa fa-chevron-right fa-5x"></i>'],
pagination: true,
transitionStyle: '<?php echo $bannertransition; ?>'
});
--></script>
