[jQuery] Re: Tabs: page jumps to top when tab changes

2009-08-05 Thread chris_huh 

I have fixed it. In the end i used the original code:

script type=text/javascript
$(function() {
$(#tabs).tabs({ fx: { opacity: 'toggle' } }).tabs
('rotate', 5000);
});
/script

But turned off the fade between items as that seems to have been the
cause. So now i am using:

$(function() {
$(#tabs).tabs().tabs('rotate', 5000);
});

Thanks

On Aug 2, 1:02 pm, chris_huh chris@gmail.com wrote:
 duh. thanks.

 but i also realise it is missing the auto rotate thing that could be
 set up using the tabs function. Is there not a way to use the tabs
 function with a return false.

 On Aug 2, 12:27 pm, waseem sabjee waseemsab...@gmail.com wrote:

  In the code above you are using hide() instead of fadeOut() etc

  On Sun, Aug 2, 2009 at 12:42 PM, chris_huh chris@gmail.com wrote:

   I tried that and it didn't work.

   The second code i pasted above works (doesn't jump to top of page) but
   it loses the fading ability.
   Where as the first bit of code has the fadign but jumps to the top, i
   don't know where to put the return false statement in that bit of code
   to prevent it doing that.

   On Aug 2, 11:26 am, waseem sabjee waseemsab...@gmail.com wrote:
return false is the standard method and will work no problem :)

there is an alternative as well

$(document).ready(function(e){ // function becomes function(e)
e.preventDefault(); // prevent default behavior and ensure the click is
canceled.
$('#tabs div').hide();
$('#tabs div:first').show();
$('#tabs ul li:first').addClass('active');

$('#tabs ul li a').click(function(){
$('#tabs ul li').removeClass('active');
$(this).parent().addClass('active');
var currentTab = $(this).attr('href');
$('#tabs div').hide();
$(currentTab).show();

});
});

just curious through if any expert out there can explain the difference
between using  return false; and e.preventDefault();

On Sun, Aug 2, 2009 at 12:21 PM, chris_huh chris@gmail.com wrote:

 Thanks. I don't know javascript much. Where would i put the return
 false

 I have:
 script type=text/javascript
        $(function() {
                $(#tabs).tabs({ fx: { opacity: 'toggle' }
 }).tabs('rotate', 5000);
        });
 /script

 And i am not using onclick events. I tried using:

 script type=text/javascript
 $(document).ready(function(){
 $('#tabs div').hide();
 $('#tabs div:first').show();
 $('#tabs ul li:first').addClass('active');

 $('#tabs ul li a').click(function(){
 $('#tabs ul li').removeClass('active');
 $(this).parent().addClass('active');
 var currentTab = $(this).attr('href');
 $('#tabs div').hide();
 $(currentTab).show();
 return false;
 });
 });

        /script

 and that works but i lose the fade effect and am not sure where to put
 it back in.

 On Jul 30, 7:33 pm, kalyan Chatterjee kalyan11021...@gmail.com
 wrote:
  Just try to write    return false on tab click event.

  On Jul 29, 6:53 pm, chris_huh chris@gmail.com wrote:

   Thanks but I can't find jquery.history_remote.pack.js. I am using
   jquery 1.7.1 and the tabs thing that comes with JQuery UI.

   On Jul 29, 2:25 pm, rupak mandal rupakn...@gmail.com wrote:

Hi, if you remove the jquery.history_remote.pack.js then I
   think it
 works
properly.

On Wed, Jul 29, 2009 at 5:50 PM, chris_huh chris@gmail.com
 wrote:

 At the moment my page will jump to the top (because of the #)
 whenever
 a new tab is clicked or when it automatically rotates to one.

 Is there a way to stop this, maybe using an onclick event
   instead
 of
 relying on the #tabs links?

[jQuery] Re: Tabs: page jumps to top when tab changes

2009-08-02 Thread chris_huh 

Thanks. I don't know javascript much. Where would i put the return
false

I have:
script type=text/javascript
$(function() {
$(#tabs).tabs({ fx: { opacity: 'toggle' } }).tabs('rotate', 
5000);
});
/script

And i am not using onclick events. I tried using:

script type=text/javascript
$(document).ready(function(){
$('#tabs div').hide();
$('#tabs div:first').show();
$('#tabs ul li:first').addClass('active');

$('#tabs ul li a').click(function(){
$('#tabs ul li').removeClass('active');
$(this).parent().addClass('active');
var currentTab = $(this).attr('href');
$('#tabs div').hide();
$(currentTab).show();
return false;
});
});

/script

and that works but i lose the fade effect and am not sure where to put
it back in.



On Jul 30, 7:33 pm, kalyan Chatterjee kalyan11021...@gmail.com
wrote:
 Just try to write    return false on tab click event.

 On Jul 29, 6:53 pm, chris_huh chris@gmail.com wrote:

  Thanks but I can't find jquery.history_remote.pack.js. I am using
  jquery 1.7.1 and the tabs thing that comes with JQuery UI.

  On Jul 29, 2:25 pm, rupak mandal rupakn...@gmail.com wrote:

   Hi, if you remove the jquery.history_remote.pack.js then I think it 
   works
   properly.

   On Wed, Jul 29, 2009 at 5:50 PM, chris_huh chris@gmail.com wrote:

At the moment my page will jump to the top (because of the #) whenever
a new tab is clicked or when it automatically rotates to one.

Is there a way to stop this, maybe using an onclick event instead of
relying on the #tabs links?

[jQuery] Re: Tabs: page jumps to top when tab changes

2009-08-02 Thread waseem sabjee 
return false is the standard method and will work no problem :)

there is an alternative as well

$(document).ready(function(e){ // function becomes function(e)
e.preventDefault(); // prevent default behavior and ensure the click is
canceled.
$('#tabs div').hide();
$('#tabs div:first').show();
$('#tabs ul li:first').addClass('active');

$('#tabs ul li a').click(function(){
$('#tabs ul li').removeClass('active');
$(this).parent().addClass('active');
var currentTab = $(this).attr('href');
$('#tabs div').hide();
$(currentTab).show();
});
});

just curious through if any expert out there can explain the difference
between using  return false; and e.preventDefault();


On Sun, Aug 2, 2009 at 12:21 PM, chris_huh chris@gmail.com wrote:


 Thanks. I don't know javascript much. Where would i put the return
 false

 I have:
 script type=text/javascript
$(function() {
$(#tabs).tabs({ fx: { opacity: 'toggle' }
 }).tabs('rotate', 5000);
});
 /script

 And i am not using onclick events. I tried using:

 script type=text/javascript
 $(document).ready(function(){
 $('#tabs div').hide();
 $('#tabs div:first').show();
 $('#tabs ul li:first').addClass('active');

 $('#tabs ul li a').click(function(){
 $('#tabs ul li').removeClass('active');
 $(this).parent().addClass('active');
 var currentTab = $(this).attr('href');
 $('#tabs div').hide();
 $(currentTab).show();
 return false;
 });
 });

/script

 and that works but i lose the fade effect and am not sure where to put
 it back in.



 On Jul 30, 7:33 pm, kalyan Chatterjee kalyan11021...@gmail.com
 wrote:
  Just try to writereturn false on tab click event.
 
  On Jul 29, 6:53 pm, chris_huh chris@gmail.com wrote:
 
   Thanks but I can't find jquery.history_remote.pack.js. I am using
   jquery 1.7.1 and the tabs thing that comes with JQuery UI.
 
   On Jul 29, 2:25 pm, rupak mandal rupakn...@gmail.com wrote:
 
Hi, if you remove the jquery.history_remote.pack.js then I think it
 works
properly.
 
On Wed, Jul 29, 2009 at 5:50 PM, chris_huh chris@gmail.com
 wrote:
 
 At the moment my page will jump to the top (because of the #)
 whenever
 a new tab is clicked or when it automatically rotates to one.
 
 Is there a way to stop this, maybe using an onclick event instead
 of
 relying on the #tabs links?

[jQuery] Re: Tabs: page jumps to top when tab changes

2009-08-02 Thread chris_huh 

I tried that and it didn't work.

The second code i pasted above works (doesn't jump to top of page) but
it loses the fading ability.
Where as the first bit of code has the fadign but jumps to the top, i
don't know where to put the return false statement in that bit of code
to prevent it doing that.

On Aug 2, 11:26 am, waseem sabjee waseemsab...@gmail.com wrote:
 return false is the standard method and will work no problem :)

 there is an alternative as well

 $(document).ready(function(e){ // function becomes function(e)
 e.preventDefault(); // prevent default behavior and ensure the click is
 canceled.
 $('#tabs div').hide();
 $('#tabs div:first').show();
 $('#tabs ul li:first').addClass('active');

 $('#tabs ul li a').click(function(){
 $('#tabs ul li').removeClass('active');
 $(this).parent().addClass('active');
 var currentTab = $(this).attr('href');
 $('#tabs div').hide();
 $(currentTab).show();

 });
 });

 just curious through if any expert out there can explain the difference
 between using  return false; and e.preventDefault();

 On Sun, Aug 2, 2009 at 12:21 PM, chris_huh chris@gmail.com wrote:

  Thanks. I don't know javascript much. Where would i put the return
  false

  I have:
  script type=text/javascript
         $(function() {
                 $(#tabs).tabs({ fx: { opacity: 'toggle' }
  }).tabs('rotate', 5000);
         });
  /script

  And i am not using onclick events. I tried using:

  script type=text/javascript
  $(document).ready(function(){
  $('#tabs div').hide();
  $('#tabs div:first').show();
  $('#tabs ul li:first').addClass('active');

  $('#tabs ul li a').click(function(){
  $('#tabs ul li').removeClass('active');
  $(this).parent().addClass('active');
  var currentTab = $(this).attr('href');
  $('#tabs div').hide();
  $(currentTab).show();
  return false;
  });
  });

         /script

  and that works but i lose the fade effect and am not sure where to put
  it back in.

  On Jul 30, 7:33 pm, kalyan Chatterjee kalyan11021...@gmail.com
  wrote:
   Just try to write    return false on tab click event.

   On Jul 29, 6:53 pm, chris_huh chris@gmail.com wrote:

Thanks but I can't find jquery.history_remote.pack.js. I am using
jquery 1.7.1 and the tabs thing that comes with JQuery UI.

On Jul 29, 2:25 pm, rupak mandal rupakn...@gmail.com wrote:

 Hi, if you remove the jquery.history_remote.pack.js then I think it
  works
 properly.

 On Wed, Jul 29, 2009 at 5:50 PM, chris_huh chris@gmail.com
  wrote:

  At the moment my page will jump to the top (because of the #)
  whenever
  a new tab is clicked or when it automatically rotates to one.

  Is there a way to stop this, maybe using an onclick event instead
  of
  relying on the #tabs links?

[jQuery] Re: Tabs: page jumps to top when tab changes

2009-08-02 Thread waseem sabjee 
In the code above you are using hide() instead of fadeOut() etc

On Sun, Aug 2, 2009 at 12:42 PM, chris_huh chris@gmail.com wrote:


 I tried that and it didn't work.

 The second code i pasted above works (doesn't jump to top of page) but
 it loses the fading ability.
 Where as the first bit of code has the fadign but jumps to the top, i
 don't know where to put the return false statement in that bit of code
 to prevent it doing that.

 On Aug 2, 11:26 am, waseem sabjee waseemsab...@gmail.com wrote:
  return false is the standard method and will work no problem :)
 
  there is an alternative as well
 
  $(document).ready(function(e){ // function becomes function(e)
  e.preventDefault(); // prevent default behavior and ensure the click is
  canceled.
  $('#tabs div').hide();
  $('#tabs div:first').show();
  $('#tabs ul li:first').addClass('active');
 
  $('#tabs ul li a').click(function(){
  $('#tabs ul li').removeClass('active');
  $(this).parent().addClass('active');
  var currentTab = $(this).attr('href');
  $('#tabs div').hide();
  $(currentTab).show();
 
  });
  });
 
  just curious through if any expert out there can explain the difference
  between using  return false; and e.preventDefault();
 
  On Sun, Aug 2, 2009 at 12:21 PM, chris_huh chris@gmail.com wrote:
 
   Thanks. I don't know javascript much. Where would i put the return
   false
 
   I have:
   script type=text/javascript
  $(function() {
  $(#tabs).tabs({ fx: { opacity: 'toggle' }
   }).tabs('rotate', 5000);
  });
   /script
 
   And i am not using onclick events. I tried using:
 
   script type=text/javascript
   $(document).ready(function(){
   $('#tabs div').hide();
   $('#tabs div:first').show();
   $('#tabs ul li:first').addClass('active');
 
   $('#tabs ul li a').click(function(){
   $('#tabs ul li').removeClass('active');
   $(this).parent().addClass('active');
   var currentTab = $(this).attr('href');
   $('#tabs div').hide();
   $(currentTab).show();
   return false;
   });
   });
 
  /script
 
   and that works but i lose the fade effect and am not sure where to put
   it back in.
 
   On Jul 30, 7:33 pm, kalyan Chatterjee kalyan11021...@gmail.com
   wrote:
Just try to writereturn false on tab click event.
 
On Jul 29, 6:53 pm, chris_huh chris@gmail.com wrote:
 
 Thanks but I can't find jquery.history_remote.pack.js. I am using
 jquery 1.7.1 and the tabs thing that comes with JQuery UI.
 
 On Jul 29, 2:25 pm, rupak mandal rupakn...@gmail.com wrote:
 
  Hi, if you remove the jquery.history_remote.pack.js then I
 think it
   works
  properly.
 
  On Wed, Jul 29, 2009 at 5:50 PM, chris_huh chris@gmail.com
   wrote:
 
   At the moment my page will jump to the top (because of the #)
   whenever
   a new tab is clicked or when it automatically rotates to one.
 
   Is there a way to stop this, maybe using an onclick event
 instead
   of
   relying on the #tabs links?

[jQuery] Re: Tabs: page jumps to top when tab changes

2009-08-02 Thread chris_huh 

duh. thanks.

but i also realise it is missing the auto rotate thing that could be
set up using the tabs function. Is there not a way to use the tabs
function with a return false.

On Aug 2, 12:27 pm, waseem sabjee waseemsab...@gmail.com wrote:
 In the code above you are using hide() instead of fadeOut() etc

 On Sun, Aug 2, 2009 at 12:42 PM, chris_huh chris@gmail.com wrote:

  I tried that and it didn't work.

  The second code i pasted above works (doesn't jump to top of page) but
  it loses the fading ability.
  Where as the first bit of code has the fadign but jumps to the top, i
  don't know where to put the return false statement in that bit of code
  to prevent it doing that.

  On Aug 2, 11:26 am, waseem sabjee waseemsab...@gmail.com wrote:
   return false is the standard method and will work no problem :)

   there is an alternative as well

   $(document).ready(function(e){ // function becomes function(e)
   e.preventDefault(); // prevent default behavior and ensure the click is
   canceled.
   $('#tabs div').hide();
   $('#tabs div:first').show();
   $('#tabs ul li:first').addClass('active');

   $('#tabs ul li a').click(function(){
   $('#tabs ul li').removeClass('active');
   $(this).parent().addClass('active');
   var currentTab = $(this).attr('href');
   $('#tabs div').hide();
   $(currentTab).show();

   });
   });

   just curious through if any expert out there can explain the difference
   between using  return false; and e.preventDefault();

   On Sun, Aug 2, 2009 at 12:21 PM, chris_huh chris@gmail.com wrote:

Thanks. I don't know javascript much. Where would i put the return
false

I have:
script type=text/javascript
       $(function() {
               $(#tabs).tabs({ fx: { opacity: 'toggle' }
}).tabs('rotate', 5000);
       });
/script

And i am not using onclick events. I tried using:

script type=text/javascript
$(document).ready(function(){
$('#tabs div').hide();
$('#tabs div:first').show();
$('#tabs ul li:first').addClass('active');

$('#tabs ul li a').click(function(){
$('#tabs ul li').removeClass('active');
$(this).parent().addClass('active');
var currentTab = $(this).attr('href');
$('#tabs div').hide();
$(currentTab).show();
return false;
});
});

       /script

and that works but i lose the fade effect and am not sure where to put
it back in.

On Jul 30, 7:33 pm, kalyan Chatterjee kalyan11021...@gmail.com
wrote:
 Just try to write    return false on tab click event.

 On Jul 29, 6:53 pm, chris_huh chris@gmail.com wrote:

  Thanks but I can't find jquery.history_remote.pack.js. I am using
  jquery 1.7.1 and the tabs thing that comes with JQuery UI.

  On Jul 29, 2:25 pm, rupak mandal rupakn...@gmail.com wrote:

   Hi, if you remove the jquery.history_remote.pack.js then I
  think it
works
   properly.

   On Wed, Jul 29, 2009 at 5:50 PM, chris_huh chris@gmail.com
wrote:

At the moment my page will jump to the top (because of the #)
whenever
a new tab is clicked or when it automatically rotates to one.

Is there a way to stop this, maybe using an onclick event
  instead
of
relying on the #tabs links?

[jQuery] Re: Tabs: page jumps to top when tab changes

2009-07-30 Thread Rodi 

you have to return false; on click.

On Jul 29, 6:53 am, chris_huh chris@gmail.com wrote:
 Thanks but I can't find jquery.history_remote.pack.js. I am using
 jquery 1.7.1 and the tabs thing that comes with JQuery UI.

 On Jul 29, 2:25 pm, rupak mandal rupakn...@gmail.com wrote:

  Hi, if you remove the jquery.history_remote.pack.js then I think it works
  properly.

  On Wed, Jul 29, 2009 at 5:50 PM, chris_huh chris@gmail.com wrote:

   At the moment my page will jump to the top (because of the #) whenever
   a new tab is clicked or when it automatically rotates to one.

   Is there a way to stop this, maybe using an onclick event instead of
   relying on the #tabs links?

[jQuery] Re: Tabs: page jumps to top when tab changes

2009-07-30 Thread kalyan Chatterjee 

Just try to writereturn false on tab click event.

On Jul 29, 6:53 pm, chris_huh chris@gmail.com wrote:
 Thanks but I can't find jquery.history_remote.pack.js. I am using
 jquery 1.7.1 and the tabs thing that comes with JQuery UI.

 On Jul 29, 2:25 pm, rupak mandal rupakn...@gmail.com wrote:

  Hi, if you remove the jquery.history_remote.pack.js then I think it works
  properly.

  On Wed, Jul 29, 2009 at 5:50 PM, chris_huh chris@gmail.com wrote:

   At the moment my page will jump to the top (because of the #) whenever
   a new tab is clicked or when it automatically rotates to one.

   Is there a way to stop this, maybe using an onclick event instead of
   relying on the #tabs links?

[jQuery] Re: Tabs: page jumps to top when tab changes

2009-07-29 Thread rupak mandal 
Hi, if you remove the jquery.history_remote.pack.js then I think it works
properly.

On Wed, Jul 29, 2009 at 5:50 PM, chris_huh chris@gmail.com wrote:


 At the moment my page will jump to the top (because of the #) whenever
 a new tab is clicked or when it automatically rotates to one.

 Is there a way to stop this, maybe using an onclick event instead of
 relying on the #tabs links?

[jQuery] Re: Tabs: page jumps to top when tab changes

2009-07-29 Thread chris_huh 

Thanks but I can't find jquery.history_remote.pack.js. I am using
jquery 1.7.1 and the tabs thing that comes with JQuery UI.

On Jul 29, 2:25 pm, rupak mandal rupakn...@gmail.com wrote:
 Hi, if you remove the jquery.history_remote.pack.js then I think it works
 properly.

 On Wed, Jul 29, 2009 at 5:50 PM, chris_huh chris@gmail.com wrote:

  At the moment my page will jump to the top (because of the #) whenever
  a new tab is clicked or when it automatically rotates to one.

  Is there a way to stop this, maybe using an onclick event instead of
  relying on the #tabs links?

[jQuery] Re: Tabs: page jumps to top when tab changes

2009-07-29 Thread chris_huh 

Thanks but I can't find jquery.history_remote.pack.js. I am using
jquery 1.7.1 and the tabs thing that comes with JQuery UI.

On Jul 29, 2:25 pm, rupak mandal rupakn...@gmail.com wrote:
 Hi, if you remove the jquery.history_remote.pack.js then I think it works
 properly.

 On Wed, Jul 29, 2009 at 5:50 PM, chris_huh chris@gmail.com wrote:

  At the moment my page will jump to the top (because of the #) whenever
  a new tab is clicked or when it automatically rotates to one.

  Is there a way to stop this, maybe using an onclick event instead of
  relying on the #tabs links?