Sorry if my comment made it sound like it was impossible... all you need to do is set up a custom event (demo):
HTML
<ul class="kwicks horizontal" >
<li id="kwick_1"></li>
<li id="kwick_2"></li>
<li id="kwick_3"></li>
<li id="kwick_4"></li>
</ul>
<input id="clickIt" type="checkbox">Click
Script
$(document).ready(function() {
$('.kwicks li').bind('click mouseover', function(e){
var clickit = $('#clickIt').is(':checked');
if ( clickit && e.type == "click" || !clickit && e.type == "mouseover") {
$(this).trigger('myCustomEvent');
}
})
$('.kwicks').kwicks({
max : 220,
spacing : 5,
event: 'myCustomEvent'
});
});
To answer your updated needs, you will need to have a variable that is set by the jwplayer event functions. I haven't tested the code below, but it should work. If it has any problems, then maybe try moving the jwplaying
variable outside the $(document).ready
to make it a global variable.
$(document).ready(function() {
var jwplaying = false;
$('.kwicks li').bind('click mouseover', function(e){
if ( jwplaying && e.type == "click" || !jwplaying && e.type == "mouseover") {
$(this).trigger('myCustomEvent');
}
})
$('.kwicks').kwicks({
max : 220,
spacing : 5,
event: 'myCustomEvent'
});
jwplayer("player").setup({
autostart: true,
flashplayer: "player.swf",
skin: 'five/glow.zip',
controlbar: "bottom",
dock: true,
events: {
onPlay : function() {
/// triggers to be click
jwplaying = true;
}, onPause : function() {
/// triggers to be mouseover
jwplaying = false;
}, onComplete: function() {
/// triggers to be mouseover
jwplaying = false;
jwplayer().stop();
}
}
});
});
On and btw, I added document
inside the $().ready
as it is not recommended by the jQuery team to use that syntax and it may be phased out in future versions.