Forum user: vmr

I am implementing tooltip functionality. It works fine but the browser's default tooltip appears too on top of the custom tooltip. Reading the docs, cancelDefault attribute by default is true and the browser's default tooltip should not display. Not sure why it is displaying in my case.

Here is my code.

<style type="text/css">
#bullettip {
display:none;
background:transparent url(black_arrow_bottom.png) 0 0 no-repeat;
font-size:12px;
height:55px;
width:160px;
padding:20px;
text-align:center;
color:#fff;
}
</style>

<div id="bullettip"> </div>

<div class="slides">
<a href="slideshow.cfm?id=egypt" title="Africa: Egypt"></a>
<a href="slideshow.cfm?id=kenya" title="Africa: Kenya"></a>
<a href="slideshow.cfm?id=middleEast" title="Africa: Middle East"></a>
<a href="slideshow.cfm?id=sAfrica" title="Africa: South Africa"></a>
</div>

<script>
$("div.slides a[title]").tooltip({tip: '#bullettip', position: 'bottom center', delay: 250, offset: [20,7], cancelDefault: true, opacity: 1});
</script>

I found the following thread where it says interval parameter can be updated dynamically on the scrollable tab using the code such as

http://flowplayer.org/tools/forum/35/20400

$(".scrollable").scrollable().getConf().interval = 0;

Is there any similar code for slideshow plugin ? I tried as follows but no luck.

$("div.tabs").tabs(".images > div").slideshow().getConf().interval

It looks like it is possible to update the interval parameter for tabs slideshow but I am not able to figure out how. Can anyone point me in the right direction. Thanks.

Is this forum alive ? I posted another thread yesterday and not even a single response yet. Can anyone please help.

I am using slideshow plugin. Trying to have value for the 'interval' attribute from a variable. I searched in the forums but could not find anything related.

Here is my code which does not take into account 'chosen_time_interval' variable set while running 'onBeforePlay' method.

$("div.tabs").tabs(".images > div", {
//load content through ajax
effect: 'ajax',
// start from the beginning after the last tab
rotate: true
// use the slideshow plugin. It accepts its own configuration
}).slideshow({
onBeforePlay: function(){
var chosen_time_interval = $("#time_interval").val()*1000;
},
clickable: false,
autoplay:false,
interval: chosen_time_interval //value 5000 or any works
});

My Play and Stop buttons are as follows.

<button onClick='$("div.tabs").tabs().play();'>Play</button>
<button onClick='$("div.tabs").tabs().stop();'>Stop</button>

Thanks for your help.

I am using Slideshow plugin and am having problem with vertical scroll bar, overflow on y-axis. Here is my CSS.

One of the slides content is more than 160px height and auto overflow is not working as intended. The vertical scroll bar appears only if I move the mouse. If I do not move the mouse, the extra content is hidden and no scroll bar appears. Anyone came across the same issue ? Please help me with the fix. Thanks.

/* container for slides */
.images {
background:#fff url(h300.png) repeat-x;
border:1px solid #666;
position:relative;
height:200px;
width:500px;
float:left;
margin:15px;
cursor:pointer;
}

/* single slide */
.images div {
display:none;
position:absolute;
top:0;
left:0;
margin:7px;
padding:15px 15px 15px 15px;
height:160px;
overflow-x: hidden;
overflow: auto;
font-size:12px;
}

hunzolo,

I am in need of the same feature. Can you please post the solution to the scrollable tabs feature. Thanks a bunch.