Menu
Hi, the code below works as a bar with a handle which you drag from left to right which will scroll images. This works in everything except IE and its driving me nuts!!!! Could anyone shed some light to why
Thanks in advance
[CODE]$(document).ready(function()
{
$(‘.button’).attr(‘data-show’, ‘0’);
$(‘.items’).wrapInner(“<table><tr>”);
$(‘.items .item’).wrap(“<td></td>”);
$(‘.button’).click(function()
{
$(this).attr(‘data-show’, $(this).attr(‘data-show’) == ‘0’ ? ‘1’ : ‘0’);
var show = ($(this).attr(‘data-show’) == ‘1’);
var eItem = $(this).parent(‘.image’).parent(‘.item’);
$(this).text(show ? ‘Close’ : ‘More Details’);
eItem.animate({width: show ? ‘400px’ : ‘200px’}, 400);
eItem.children(‘.image’).animate({left: show ? ‘200px’ : ‘0px’},
400, function()
{
eItem.children(‘.info’).css(‘display’, show ? ‘block’ : ‘none’);
});
});
$(‘.handle’).draggable({
containment: ‘.bar’,
drag: function(event, ui)
{
var full = $(‘.bar’).width() – $(this).width();
var position = ui.position.left / full;
position *= ($(‘.items’).children(‘table’).width() – $(‘.itemWrap’).width());
$(‘.itemWrap’).scrollLeft(position);
}
});
document.onselectstart = function() {
return false;
};
});