I have got HTML code for slideshow to post in webpages, but i want ‘next’ and ‘prev’ buttons at left and right side in middle section of the slideshow with hover effect, for example – [url]http://widgets-tricks.blogspot.in/2014/07/orbit-jquery-image-slider-for-blogger.html
Please someone help me. Thnx in advance.
The HTML code is given below ———————————-
[code=html]
<div dir=”ltr” style=”text-align: left;” trbidi=”on”>
<br /></div>
<script type=”text/javascript”>
// Author: ricocheting.com
// Description: slideshow that allows visitors to flip through a series of images on your website
var x=0;
function rotate(num){
fs=document.ff.slide;
x=num%fs.length;
if(x<0) x=fs.length-1;
document.images.show.src=fs.options[x].value;
fs.selectedIndex=x;}
function auto() {
if(document.ff.fa.value == “Stop”){
rotate(++x);setTimeout(“auto()”, 5000);}}
</script>
<form name=”ff”>
<table cellpadding=”3″ style=”border:1px black solid;border-collapse:collapse;”>
<tr><th align=”center”>mother teresa</th></tr>
<tr><td align=”center”>
<img src=”http://3.bp.blogspot.com/-LQ4rmKzvwyE/VOLwSF1OuEI/AAAAAAAAAAs/sEEr1KIT5xs/s1600/Mother-Teresa7.jpg” width=”550″ name=”show”>
</td></tr>
<tr><td align=”center” style=”border:1px black solid;”>
<select name=”slide” onChange=”rotate(this.selectedIndex);”>
<option value=”http://3.bp.blogspot.com/-LQ4rmKzvwyE/VOLwSF1OuEI/AAAAAAAAAAs/sEEr1KIT5xs/s1600/Mother-Teresa7.jpg”></option>
<option value=”http://3.bp.blogspot.com/-a3Iiqvbtsh4/VOLwSRBn_TI/AAAAAAAAAAw/BaOSrGOth6w/s1600/mother-teresa77.jpg”></option>
<option value=”http://3.bp.blogspot.com/-JrpHMdyW6Uo/VOLwQ1lZzGI/AAAAAAAAAAk/h14FJ0crZaA/s1600/mother-teresa.jpg”></option>
<option value=”http://3.bp.blogspot.com/-g_KJJsDUO_Y/VOLwUFvoS1I/AAAAAAAAABA/qkm7G51I_5Y/s1600/mothert3.jpg”></option>
<option value=”http://2.bp.blogspot.com/-0F9XMbjNReY/VOLwTodv4vI/AAAAAAAAAA8/O-0lEuy7xrk/s1600/motherteresa.jpg”></option>
<option value=”http://1.bp.blogspot.com/-LTPasx3hrVw/VOLwVBWD2PI/AAAAAAAAABM/gFPfL_ehGMM/s1600/skepticism_org.jpg”></option>
</select>
</td></tr>
<tr><td align=”center” style=”border:1px black solid;”>
<input type=”button” onclick=”rotate(0);” value=”ll<<” title=”Jump to beginning” />
<input type=”button” onclick=”rotate(x-1);” value=”<<” title=”Last Picture” />
<input type=”button” name=”fa” onClick=”this.value=((this.value==’Stop’)?’Start’:’Stop’);auto();” value=”Start” title=”Autoplay” style=”width:75px;” />
<input type=”button” onclick=”rotate(x+1);” value=”>>” title=”Next Picture” />
<input type=”button” onclick=”rotate(this.form.slide.length-1);” value=”>>ll” title=”Jump to end” />
</td></tr></table></form>
[canned-message]attachments-removed-during-migration