when I click on the right and left arrows of the media bar it does not scroll through the bar for me.
I have a site where it shows the working code and my site where it is not working if that helps
my site is:
and the working site is
I’d really appreciate it if someone could tell me how to fix it
Many thanks
In the working example you have two sets of .media-slide divs each containing the number of thumbs that fit across the width. In the non working version you have only one .media-slide div containing all the thumbs. If you create two .media-slide divs then it starts working.
e.g.
<div id="multi-media-bar">
<h3 class="title">Multi Media Bar</h3>
<div id="et-multi-media" class="clearfix"> <a id="left-multi-media" href="#">Previous</a> <a id="right-multi-media" href="#"Next></a>
<div id="media-slides">
<div class="media-slide">
<div class="thumb"> <a href="#et_video_post_146" class="et-video fancybox" title="Abu Talha presents"> <img src="http://salafiwales.co.uk/wp-content/uploads/et_temp/abut1-203452_48x48.png" class='multi-media-image' alt='Abu Talha presents' width='48' height='48' /> <span class="more"></span> </a>
<div class="media-description">
<p>Abu Talha presents – Explanation of Aqeedah Tahawiyyah </p>
<span class="media-arrow"></span> </div>
</div>
<!-- end .thumb -->
<div class="thumb"> <a href="#et_video_post_129" class="et-video fancybox" title="Advice of Ibn Al Qayyim"> <img src="http://salafiwales.co.uk/wp-content/uploads/et_temp/advice-32117_48x48.jpg" class='multi-media-image' alt='Advice of Ibn Al Qayyim' width='48' height='48' /> <span class="more"></span> </a>
<div class="media-description">
<p>Hasan as-Somali lecture – The advice of Ibn Qayyim to Ahlus Sunnah From His an-nooni</p>
<span class="media-arrow"></span> </div>
</div>
<!-- end .thumb -->
<div class="thumb"> <a href="#et_video_post_72" class="et-video fancybox" title="Ibn Uthaimeen"> <img src="http://salafiwales.co.uk/wp-content/uploads/et_temp/albaaniaqida-76938_48x48.png" class='multi-media-image' alt='Ibn Uthaimeen' width='48' height='48' /> <span class="more"></span> </a>
<div class="media-description">
<p>Shaikh Ibn Uthaymeen – Aqidah
</p>
<span class="media-arrow"></span> </div>
</div>
<!-- end .thumb -->
<div class="thumb"> <a href="#et_video_post_67" class="et-video fancybox" title="What Is As – Salafiyyah?"> <img src="http://salafiwales.co.uk/wp-content/uploads/et_temp/uthaimeen-154335_48x48.png" class='multi-media-image' alt='What Is As – Salafiyyah?' width='48' height='48' /> <span class="more"></span> </a>
<div class="media-description">
<p>Shaikh Uthaimeen – What Is Salafiyyah? </p>
<span class="media-arrow"></span> </div>
</div>
<!-- end .thumb -->
<div class="thumb"> <a href="#et_video_post_62" class="et-video fancybox" title="The Day We Stand Before Allah"> <img src="http://salafiwales.co.uk/wp-content/uploads/et_temp/theday-170988_48x48.png" class='multi-media-image' alt='The Day We Stand Before Allah' width='48' height='48' /> <span class="more"></span> </a>
<div class="media-description">
<p>The Day We Stand Before Allah – Hasan As – Somali </p>
<span class="media-arrow"></span> </div>
</div>
<!-- end .thumb -->
</div>
<!-- end .media-slide -->
<div class="media-slide">
<div class="thumb"> <a href="#et_video_post_1" class="et-video fancybox" title="What Is As – Salafiyyah?"> <img src="http://salafiwales.co.uk/wp-content/uploads/et_temp/whatissalalafiyyah-208720_48x48.png" class='multi-media-image' alt='What Is As – Salafiyyah?' width='48' height='48' /> <span class="more"></span> </a>
<div class="media-description">
<p>What Is A – Salafiyyah? – Naasir – Ad – Deen Al Albaani </p>
<span class="media-arrow"></span> </div>
</div>
<!-- end .thumb -->
<div class="thumb"> <a href="http://www.elegantthemes.com/preview/Chameleon/wp-content/uploads/2010/09/s-2.png" rel="media" class="fancybox" title="Summer Wheat"> <img src="http://www.elegantthemes.com/preview/Chameleon/wp-content/uploads/et_temp/s-2-458164_48x48.png" class='multi-media-image' alt='Summer Wheat' width='48px' height='48px' /> <span class="more"></span> </a>
<div class="media-description">
<p>Donec sed metus ipsum, laoreet suscipit purus. Fusce ante lorem, luctus et tincidunt vel,...</p>
<span class="media-arrow"></span> </div>
</div>
<!-- end .thumb -->
<div class="thumb"> <a href="#et_video_post_253" class="et-video fancybox" title="Calm Before The Storm"> <img src="http://www.elegantthemes.com/preview/Chameleon/wp-content/uploads/et_temp/shutterstock_5055934-183251_48x48.jpg" class='multi-media-image' alt='Calm Before The Storm' width='48px' height='48px' /> <span class="more"></span> </a>
<div class="media-description">
<p>Donec auctor ullamcorper nunc, vitae pellentesque mi fringilla posuere. Maecenas semper...</p>
<span class="media-arrow"></span> </div>
</div>
<!-- end .thumb -->
<div class="thumb"> <a href="http://elegantthemes.com/preview/DeepFocus/wp-content/uploads/2010/09/shutterstock_20951311.jpg" rel="media" class="fancybox" title="Bamboo Shoots"> <img src="http://www.elegantthemes.com/preview/Chameleon/wp-content/uploads/et_temp/shutterstock_20951311-105492_48x48.jpg" class='multi-media-image' alt='Bamboo Shoots' width='48px' height='48px' /> <span class="more"></span> </a>
<div class="media-description">
<p>Etiam cursus, nibh in suscipit tincidunt, ante enim scelerisque lacus, sed consectetur...</p>
<span class="media-arrow"></span> </div>
</div>
<!-- end .thumb -->
</div>
<!-- end .media-slide -->
</div>
<!-- end #media-slides -->
</div>
<!-- end #et-multi-media -->
</div>
<!-- end #multi-media-bar -->
However, I don’t think that’s the right answer and you should probably refer to the documentation that comes with that slider as it seems a bit strange to have to do that.
great!!! I will try and sort that out… Only problem is the file is a php file so now I have to figure out where to find the html but thank you very much, I am now a step closer