Account Options

  1. Sign in
The old Google Groups will be going away soon, but your browser is incompatible with the new version.
Google Groups Home
« Groups Home
Hover and click effects
There are currently too many topics in this group that display first. To make this topic appear first, remove this option from another topic.
There was an error processing your request. Please try again.
flag
  8 messages - Collapse all  -  Translate all to Translated (View all originals)
The group you are posting to is a Usenet group. Messages posted to this group will make your email address visible to anyone on the Internet.
Your reply message has not been sent.
Your post was successful
 
From:
To:
Cc:
Followup To:
Add Cc | Add Followup-to | Edit Subject
Subject:
Validation:
For verification purposes please type the characters you see in the picture below or the numbers you hear by clicking the accessibility icon. Listen and type the numbers you hear
 
Martina  
View profile  
 More options May 18 2009, 7:57 pm
From: Martina <martina.l...@wineselectors.com.au>
Date: Mon, 18 May 2009 16:57:01 -0700 (PDT)
Local: Mon, May 18 2009 7:57 pm
Subject: Hover and click effects
I have some jQuery tabs which are using the hover effect to change the
tabs.

Can I also use the onClick event to actually link to another page?

If so how? This is my code which is adding the hover effect;

    $(function() {
        var $tabs = $("#tabs").tabs(
        {
            event: 'mouseover',
            selected: -1,
            select: function(event, ui) {
                $('#noTab').hide(); // hidding the noTab
            }
        })
        var selected = $tabs.tabs('option', 'selected');
        if (selected == -1) // Just making sure that no tabs is
selected
        {
            $('#noTab').show();
            var setSelected = gup('TabID');
            if (setSelected != '') {
                $("#tabs").tabs('select', setSelected);
            }
        }
    });


 
You must Sign in before you can post messages.
To post a message you must first join this group.
Please update your nickname on the subscription settings page before posting.
You do not have the permission required to post.
Martina  
View profile  
 More options May 21 2009, 1:07 am
From: Martina <martina.l...@wineselectors.com.au>
Date: Wed, 20 May 2009 22:07:47 -0700 (PDT)
Local: Thurs, May 21 2009 1:07 am
Subject: Re: Hover and click effects
Has anyone else successfully been able to do this or know how I might
try?

On May 19, 9:57 am, Martina <martina.l...@wineselectors.com.au> wrote:


 
You must Sign in before you can post messages.
To post a message you must first join this group.
Please update your nickname on the subscription settings page before posting.
You do not have the permission required to post.
jsjqueryemail@gmail.com  
View profile  
 More options May 21 2009, 1:39 am
From: "jsjqueryem...@gmail.com" <jsjqueryem...@gmail.com>
Date: Wed, 20 May 2009 22:39:57 -0700 (PDT)
Local: Thurs, May 21 2009 1:39 am
Subject: Re: Hover and click effects
Where are you trying to load the other page? Are you trying to do
something like
'Contact Via Ajax' tabs demo, but separate the the mouseover action
from the
clicking?

On May 21, 12:07 am, Martina <martina.l...@wineselectors.com.au>
wrote:


 
You must Sign in before you can post messages.
To post a message you must first join this group.
Please update your nickname on the subscription settings page before posting.
You do not have the permission required to post.
Martina  
View profile  
 More options May 25 2009, 7:58 am
From: Martina <martina.l...@wineselectors.com.au>
Date: Mon, 25 May 2009 04:58:30 -0700 (PDT)
Local: Mon, May 25 2009 7:58 am
Subject: Re: Hover and click effects
Basically i want the tab hover effect to show the div content which is
like a blurb about different pages and when you actually click on the
tab you actually go to that page

On May 21, 3:39 pm, "jsjqueryem...@gmail.com"


 
You must Sign in before you can post messages.
To post a message you must first join this group.
Please update your nickname on the subscription settings page before posting.
You do not have the permission required to post.
Martina  
View profile  
 More options May 25 2009, 7:58 am
From: Martina <martina.l...@wineselectors.com.au>
Date: Mon, 25 May 2009 04:58:47 -0700 (PDT)
Local: Mon, May 25 2009 7:58 am
Subject: Re: Hover and click effects
Basically i want the tab hover effect to show the div content which is
like a blurb about different pages and when you actually click on the
tab you actually go to that page

On May 21, 3:39 pm, "jsjqueryem...@gmail.com"


 
You must Sign in before you can post messages.
To post a message you must first join this group.
Please update your nickname on the subscription settings page before posting.
You do not have the permission required to post.
jsjqueryemail@gmail.com  
View profile  
 More options May 25 2009, 3:46 pm
From: "jsjqueryem...@gmail.com" <jsjqueryem...@gmail.com>
Date: Mon, 25 May 2009 12:46:09 -0700 (PDT)
Local: Mon, May 25 2009 3:46 pm
Subject: Re: Hover and click effects
From my understanding of your question, there's no native way to do
it
because your href can only do one thing -either load content (or
blurb)
from the page or ajax, or open the link in a new window. There's no
way
to do both as is because you're trying to make one href item do two
things.

However, there's an easy hack around it:

This assumes every tab needs to link to an external page- the title
attribute
is used to hold the page to go to on click. The '.tabs()' call gets
the
mouseover for blurb loading, and a separate .click() function handles
the
actual page loading.

<div id="tabs">
<ul>
<li><a href="#tab-1" title="content1.html">Preview Tab 1</a></li>
<li><a href="#tab-2" title="content2.html">Preview Tab 2</a></li>
<li><a href="#tab-3" title="content3.html">Preview Tab 3</a></li>
</ul>
<div id=tab-1>This is tab 1 preview</div>
<div id=tab-2>This is tab 2 preview</div>
<div id=tab-3>This is tab 3 preview</div>
</div>

  $("#tabs").tabs({
        event: 'mouseover'
    });
    $("#tabs > ul > li >a").click(function(){
        window.location=$(this).attr('title');
    });

If you don't have a title assigned for each href and you do click on
the tab, IE may complain based on your settings. If you don't need
an external link on every tab, the following will be a better way:

-----------------------------------------------

<div id="tabs">
<ul>
<li><a href="#tab-1">Regular Tab 1</a></li>
<li><a href="#tab-2" title="content1.html" class=openpage>Preview Tab
1</a></li>
<li><a href="#tab-3" title="content2.html" class=openpage>Preview Tab
2</a></li>
</ul>

<div id=tab-1>This is tab 1 content</div>
<div id=tab-2>This is tab 2 preview</div>
<div id=tab-3>This is tab 3 preview</div>
</div>

 $("#tabs").tabs({
        event: 'mouseover'
    });
    $('.openpage').click(function(){
        window.location=$(this).attr('title');
    });

Again, this is pretty much a hack using the title attribute in a way
some
css purists may not approve of. If you're willing to risk a visit from
the CSS
police, this will work in Firefox, IE, Chrome, and Opera.

On May 25, 6:58 am, Martina <martina.l...@wineselectors.com.au> wrote:


 
You must Sign in before you can post messages.
To post a message you must first join this group.
Please update your nickname on the subscription settings page before posting.
You do not have the permission required to post.
Martina  
View profile  
 More options May 27 2009, 8:14 pm
From: Martina <martina.l...@wineselectors.com.au>
Date: Wed, 27 May 2009 17:14:26 -0700 (PDT)
Local: Wed, May 27 2009 8:14 pm
Subject: Re: Hover and click effects
This works like a charm, the only issue is that i need to set the link/
title url value from the database and I can do this when i set the tab
label and content because these also come from the database, but when
i set the a href id and the runat to server so I can access the link
to set the title the page goes crazy and I keep getting a loading...
where the tab name should be?

On May 26, 5:46 am, "jsjqueryem...@gmail.com"


 
You must Sign in before you can post messages.
To post a message you must first join this group.
Please update your nickname on the subscription settings page before posting.
You do not have the permission required to post.
jsjqueryemail@gmail.com  
View profile  
 More options May 29 2009, 4:58 pm
From: "jsjqueryem...@gmail.com" <jsjqueryem...@gmail.com>
Date: Fri, 29 May 2009 13:58:36 -0700 (PDT)
Local: Fri, May 29 2009 4:58 pm
Subject: Re: Hover and click effects
Do you have a sample of the code you could post?

On May 27, 7:14 pm, Martina <martina.l...@wineselectors.com.au> wrote:


 
You must Sign in before you can post messages.
To post a message you must first join this group.
Please update your nickname on the subscription settings page before posting.
You do not have the permission required to post.
End of messages
« Back to Discussions « Newer topic     Older topic »