Hi,
I've got just a lot of troubles dragging
(the items is hidden by the container)
items inside a slider.
Following the refence I ended up with
PHP Code:
var draggableOptions = {
        
cursor'move',
        
containment'#wrapper-generate',
        
revert'invalid',
        
helper'clone',
        
zIndex9999,
        
stack'.draggable'
    
}; 
but it doesn't work
The problem is the simple slider logic
with the draggable items in relative position
(If I get rid of position:relative of the items container
the drag works but so don't the slider of course )
PHP Code:
#items{
    
height105px;
    
overflowhidden
    
width:  680px;
}
#items ul{
    
positionrelative;
    
left0
    
top0;
    
}
#items ul li{
    
border1px solid #000;
    
floatleft;
    
height103px;
    
margin-right:10px;
    
width103px;
}
#items ul li img{
    
height103px;
    
width103px;
}
a#btn-slider-previous,a#btn-slider-previous:hover,a#btn-slider-next,a#btn-slider-next:hover{
    
height35px;
    
positionabsolute;
    
top115px;
    
width22px;
}
a#btn-slider-previous img,a#btn-slider-next img{
    
height35px;
    
width22px;
}
#btn-slider-previous{
    
left:30px;
}
#btn-slider-next{
    
right:30px;
}
function 
sliderManager(){
        var 
$slider = $('#items ul');
        var 
totalImages = $('li',$slider).length;
        
imageWidth = $('li:first',$slider).outerWidth(true);
        var 
totalWidth imageWidth totalImages;
        var 
visibleImages Math.round($items.width() / imageWidth);
        var 
visibleWidth visibleImages imageWidth;
        
stopPosition = (visibleWidth totalWidth);
        
$slider.width(totalWidth);
        return 
$slider;
 }
var 
$slider sliderManager();
$(
'#btn-slider-previous').click(function(e){
    
e.preventDefault();
    var 
$slider sliderManager();
     if(
$slider.position().left && !$slider.is(':animated')){
         
$slider.animate({left '+=' imageWidth 'px'});
     }
});
$(
'#btn-slider-next').click(function(e){
    
e.preventDefault();
    var 
$slider sliderManager();
    if(
$slider.position().left stopPosition && !$slider.is(':animated')){
        
$slider.animate({left '-=' imageWidth 'px'});
    }
}); 
Do you have any tips ?
please