my pleasure :)
On Tue, Nov 11, 2008 at 12:53 PM, David Wu <[EMAIL PROTECTED]> wrote:
> Fantastic, thanks a lot!!!!
>
> On Tue, Nov 11, 2008 at 7:32 PM, Alexandre Plennevaux <[EMAIL PROTECTED]>
> wrote:
>>
>> activate the button in a callback function after the animate
>>
>> var isClickable = true;
>>
>> right.click(function()
>> {
>> if(ul.css('left') != (maxMove * -1) + 'px' &&
>> isClickable)
>> {
>> isClickable = false;
>> ul.animate({left:'-=50px'},function(){
>> isClickable = true;
>> });
>> }
>> });
>>
>>
>> On Tue, Nov 11, 2008 at 11:06 AM, David .Wu <[EMAIL PROTECTED]> wrote:
>> >
>> > Hi everybody
>> > This my testing gallery slider, it will count image's amount, and
>> > prevent it not to outside the wrapper, but I got one problem, if user
>> > click button after the animation finished, it's done well, but if user
>> > click too fast, the js will not catch the left property in time
>> > correctly, how to fix the bug?
>> >
>> > CSS
>> > <style type="text/css">
>> > <!--
>> > body { font-size: 12px; }
>> > #wrapper
>> > {
>> > height: 50px;
>> > width: 50px;
>> > overflow: hidden;
>> > position: relative;
>> > border:1px #FF0000 solid;
>> > }
>> > ul
>> > {
>> > margin: 0px;
>> > padding: 0px;
>> > list-style-type: none;
>> > position: absolute;
>> > white-space:nowrap;
>> > }
>> > li
>> > {
>> > display:inline;
>> > margin:0 -3px 0 0;
>> > width:50px;
>> > height:50px;
>> > overflow:hidden;
>> > }
>> > -->
>> > </style>
>> >
>> > HTML
>> > <div id="wrapper">
>> > <ul>
>> > <li><img src="1.jpg" border="0" /></li>
>> > <li><img src="2.jpg" border="0" /></li>
>> > <li><img src="3.jpg" border="0" /></li>
>> > </ul>
>> > </div>
>> > <input type="button" name="left" id="left" value="left" />
>> > <input type="button" name="right" id="right" value="right" />
>> >
>> > JavaScript
>> > <script language="javascript">
>> > <!--
>> > $(document).ready(function()
>> > {
>> > var wrapper = $('#wrapper');
>> > var ul = $('ul',wrapper);
>> > var itemsWidth = $('li',ul).outerWidth();
>> > var itemsLen = $('li',ul).size();
>> > var maxMove = (itemsLen - 1) * itemsWidth;
>> > var minMove = 0;
>> > var right = $('#right');
>> > var left = $('#left');
>> > right.click(function()
>> > {
>> > if(ul.css('left') != (maxMove * -1) + 'px')
>> > {
>> > ul.animate({left:'-=50px'});
>> > }
>> > });
>> > left.click(function()
>> > {
>> > if(ul.css('left') != minMove + 'px')
>> > {
>> > ul.animate({left:'+=50px'});
>> > }
>> > });
>> > });
>> > //-->
>> > </script>
>> >
>
>
