AJAX Toolkit Tab control , how to change the active page when hover?

Hi ,
It is really cool with the AJAX Toolkit TAb control , I have put 3 tabs in a contorl , and works well ,
But with the default behaviour , I have to click on the tab header to change the current tab.

Can I do it without click , says , change the tab when mouse hover?
I have seen that there are lots of similar tab on internet,  but I have no idea are they done by AJAX Toolkit?

11/3/2008 11:42:34 PM
asp.net.ajax_control_toolkit 17816 articles. 1 followers. Follow

2 Replies

Similar Articles

[PageSpeed] 38

Hi liqiug
We can achieve the facing goal by modify the source code of AJAX Control Toolkit, please find the “Tabs.js”, and change the “_header_onmouseover” (near the 522nd line) as following:
    _header_onmouseover: function(e) {
        Sys.UI.DomElement.addCssClass(this._tab, "ajax__tab_hover");


Lance Zhang
Microsoft Online Community Support

Please remember to mark the replies as answers if they help and unmark them if they provide no help.
11/6/2008 6:13:06 AM

 Cool ! Thanks Lance Zhang.

11/6/2008 11:08:30 AM

Similar Artilces:

Tab Controls/tab pages/controls within tab pages
I give up! I have a tab control user object - inherited from u_tab - and some tab pages. Initially only one page is enabled which has a datawindow. When a valid data is entered in the DW, I need to enable rest of the tabs - Now - it is giving me a NULL object reference error during execution for the following statement in an event of the DW - tabcontrol.tabpage.enabled=TRUE getparent( ) also giving errors - HELP! How can I do this? Thanks! Ragni rpanjala@nsf.gov Ragni -- If you have CreateOnDemand set for the tab, then the tab pages are not valid until the user accesses them. ...

Ajax control toolkit tabcantainer -- Need to show diffrent image for eact tab in the container and also a diffrent one for Active tab
I need to put diffrent back ground images on each tab of tab continer and another image on active Tab,I had tried with some code overriding default css but I could acheive only to ahow diffrent images for active and non active tabs but not diffrent images for each tab.I am attaching my css code here   .test .ajax__tab_tab {border:0px;background:url("./gui_images/blue_what.gif") no-repeat;width:85px;} .test .ajax__tab_active .ajax__tab_outer {background:url(../Images/Tabs/tab-active-right.gif) no-repeat right;} .test .ajax__tab_active .ajax__tab_inner {background:url(../Images/Tabs/...

Page and Control Flashing Using AJAX Control Toolkit Controls
Page and Control Flashing Using AJAX Control Toolkit Controls I'm using IE7 and the ASP.NET AJAX Control Toolkit.  I'm using two controls -- Accordion and CollapsiblePanelExtender.  I'm actually using 2 CollapsiblePanelExtenders, and the Accordion control is inside one of the panels for the CollapsiblePanelExtender (see the code below). The problem I'm seeing is that when I click an Accordion pane to open/close it or click the CollapsiblePanelExtender panel to open/close the panels, the controls and page flash while the animation is in progess.  Everything el...

Tab Control
Hi,I have a quick question that I am hoping will have an easy answer.I have a form with a tab control and 3 tabs.  What I would like to do is have a button on one of the tabs change the active tab.So under tab 1 the users clicks the button which will bring them to tab 2.  I know they can just click on the tab header at the top however I want to do some quick validation of information before making that tab visible and switching focus to it, is this possible?Regards,Daryl  function SetTabIndex(index){var tabs = $find('TabContainerClientID');tabs.set_activeTabIndex(index);} ...

AJAX Control Toolkit Tabs Control...
I have a tab control where I would like make the height of the control 100%. Can someone give me an example or provide me with direction on how to accomplish this...   Thanks... Hi there, In the TabContainer properties you can specify hight. Not sure about percentage though! <Ajax:TabContainer ID="TabContainer1" runat="server" ActiveTabIndex="0" Height="300px"> Hope that answers your questionKind regardsMikael Thanks but, I was already aware that there was the height property. However, it does not allow percentages...  Any ideas..?? I guess you could request suppo...

The Tabs control in the AJAX Control Toolkit behaves like a regular postback control
I have the following markup in an ASP.NET page:<html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"><title>Untitled Page</title> </head> <body> <form id="form1" runat="server"> <div>   <cc1:ToolkitScriptManager runat="Server" EnablePartialRendering="true" ID="ScriptManager1"></cc1:ToolkitScriptManager> <asp:UpdatePanel ID="UpdatePanel1" runat="server"> <ContentTemplate> <cc1:TabContainer ID="TabC...

page repositions to the top when sorting a gridview in ajax control toolkit tabs
Hi, We are using Ajax control toolkit tab container and one of the tabs has a sortable gridview. When we sort this gridview by clicking the header link, the page is repositioned to the top. Does anyone know how to prevent such page repositioning? Appreciate! Thanks Leon  From what you said I get that your gridview is NOT displayed at the top of the page. That means when handling the sorting event you should just do a gvXXXX.Focus(). Does it help?I don't suffer from madness, I enjoy it every minute of my life  <@Page ... MaintainScrollPositionOnPostBack="...

Having different aspx pages shown in ajax control toolkit tab container
Hi all, I have a page that includes 5 different tabs(using ajax tabs). I want to seperate these tabs to different pages(right now, all the content is on one page which is tabbed) but still have the same tabbed view(a set of tabs each showing a different page). Anyone has any idea? Regards, Sina Hi There, You can try using iframe wihtin the tab panel. see example: <body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> <div> <cc1:TabContainer ID=&qu...

I do not see Tab control in my AJAX Control Toolkit.
First, how do I update my version of the AJAX Control Toolkit to the latest? Second, is there a way to tell what version of AJAX Control Toolkit I have? Third, I do not see the Tab control as one of the available AJAX controls in my Toolbox. Am I missing something? If you just have a reference to the AjaxControlToolkit.dll - you just need to delete it and reference the latest version. If you have a project reference, you'll need to make sure the project is the version you want and rebuild it. You'll also be able to see if the folder for Tabs is there - it should be as I believe it was in ...

Ajax Control Toolkit Tab Control
Hi Folks,  I am trying to get the Tab Container working. I have spent the past 3 days going through each and every post online and right now I am writing this as a last resort. I do not want any postback. I have a container with two tabs. I have a few text boxes, labels and one calendar extender in each tab and all I do in each tab is collect user information depending on the user type. When I run the code, only one tab shows up with all of its contents.This is the tab with the ActiveTabIndex="0". The other tab shows none of its controls when selected - only the ...

Ajax Control Toolkit: Tab Control Hidden
Hi,I have added a tab control to a page, and set everything up to be visible, however when I view the page the control is hidden.I have tried making sure it is visible via the code behind (tab1.visible = true), but this still doesn't show the control.Here is the code I have used to create the control: 1 <ajax:TabContainer runat="server" ID="Tab1"> 2 <ajax:TabPanel runat="server" ID="Panel1" HeaderText="Add"> 3 Add 4 </ajax:TabPanel> 5 </ajax:TabContainer>   I have trie...

Uploading pages in different tabs of ajax tab control
Hi all, I have 6 different pages, each loading in a different tab of an ajax tab container. I have written my page in a way that on click on each tab, its related page is being loaded using update panel. The problem is this imposes a delay when user clicks and wants to move from tab to tab. On the other hand, I can change the page that all pages and contents get loaded and then be displayed as tabbed page. But in that case, it takes to long for all of them to be loaded at the same time. Waht I need is something in between. I want them to start loadning, first tab loads and user can work wit...

AJAX Control Toolkit's Tabs control in an UpdatePanel
If you place the Tabs control in an UpdatePanel and set the AutoPostBack property of the TabContainer to true, every time you click on one of the TabPanel controls which causes the active tab to change, the rendering of the control causes a flicker. It appears like a postback, although it is not. Any way to get around this? Thanks.  Thanks. I used it . i never got the problem.<script type="text/javascript">            function PanelClick(sender, e) {    }    function ActiveTabChanged(sen...

to change active tab index in ajax tabs in server side
i am using tabcontainer with 4 tabs all having update panels inside it to prevent full postback but my tab container is not in update panel.i want to change the active tab index of a button click present inside in one of the tabs by tabcontainer.activetabindex=1.but it i not changing the active tab index can any one help this....thnx in advanecAALAVANDAAN...

Web resources about - AJAX Toolkit Tab control , how to change the active page when hover? - asp.net.ajax_control_toolkit

Dojo Toolkit - Wikipedia, the free encyclopedia
Dojo is a JavaScript framework targeting the many needs of large-scale client-side web development. For example, Dojo abstracts the differences ...

Geocaching Toolkit iGCT on the App Store on iTunes
Get Geocaching Toolkit iGCT on the App Store. See screenshots and ratings, and read customer reviews.

My PC toolkit - Flickr - Photo Sharing!
You aren't signed in Sign In Help Home The Tour Sign Up Explore Explore Home Last 7 Days Interesting Popular Tags Calendar Most Recent Uploads ...

Firefall e-sports toolkit reveal trailer - YouTube
Red 5's Morgan Romine takes you through the new spectator and casting tools being added to Firefall in advance of the beta tournament at GamesCom ...

Quickly create stylish icons with Seanau Icon Toolkit
... for the process that’s if they have ICO support at all while specialist icon designers are often bulky and complex. Seanau Icon Toolkit is ...

Survive vacation! A mobile toolkit for the road
Off the beaten path doesn’t mean offline, as long you take these mobile essentials with you

IDF San Francisco 2015: Intel expands developer opportunities with new toolkits
In the opening address at the Intel Developer Forum (IDF), CEO Brian Krzanich highlighted new products, tools and programs that support the growing ...

Facebook Adds New SDKs to Its Parse for IoT Toolkit
Facebook targets IoT developers with new SDKs; Microsoft backs FCC's affordable broadband proposal; Skype unveils redesigned and improved Android ...

Microsoft open-sources machine learning toolkit less than a week after Google
... movement to make machine learning an open source option for developers. The software giant announced today that its machine learning toolkit, ...

This Is the Most Important Tool in Your Toolkit
Because it’s only a matter of time before you realize you need the help of someone who actually knows what they’re doing. Read more...

Resources last updated: 11/30/2015 8:43:44 AM