I'm having trouble figuring out why content isn't showing up on the 2nd and 3rd tabs of a tabbed content section embedded on a page. The content shows fine for the first tab but not at all for 2 and 3.
Page of tabbed content is [URL].. It's an OsCommerce site using STS Templates for the pages. Here's the code:
[Code]...
For some reason, when my first div loads, I'm seeing all 3 text show up even though they're in different <div> containers:
<script type="text/javascript">
$(document).ready(function() {
$('#Tabs').tabs({ fx: { opacity: 'toggle'} });
});
[Code].....
Here's a print screen: [URL] so you can see that for some reason all of that text is showing up at the same time. Do I need to hide the other divs first? I even tried that with adding $('#Tabs div0').hide(); // Hide all divs but it did not help. I would assume out of the box, it would hide the rest of the divs for me and only show the default first.
I am using jQuery tabs and when I have very long content within the tabs, my browsers scroll bar reflects the content in the tab with the most content.
Example, "Tab 1" & "Tab 3" has a very long scroll bar, even though it has no content (because of Tab 2) and you can scroll down through the empty space
[URL]
Is there a way I can hide the content in Tab 2 so that my browsers scroll bar displays correctly in relation to the content in the active tab?
I'm having issues with jquery and the tabs I'm using. My tabs work but... I want some more functions and that seems to be a big problem for a Javascript and jquery newby.
My HTML:
Code:
<ul class="tabs">
<li>Tab1</li>
<li>Tab2</li>
[Code]....
I really don't know if this is correct but it works! What doesn't work is the active class. If you use one of the buttons in the first tab you go to the right tab but the tab itself has no class called active and that ruins the style.
2)
I also have one other question: lets say that all the above is my second page and I have my frontpage in which I also have buttons. I want somebody to use the button and end up in the third tab of page 2. My link is something like
Code:
page2.html#tab3
I read that using this should lead you the third tab but it's not working for me. You go to the first tab of page 2 instead.
I've been reading a LOT! Jquery for dummies, I googled, read the forum and other forums. I posted on a Dutch forum but no answer. I've added a lot of different code but it doesn't work.
I have nested tabs in jquery tabs which are pretty simple to do if we want static jquery tabsbut what if we want nested tabs that the remote page should decide what would be the tabs.or in other words i want nested tabs in a remote page (or ajaxified) For example i m calling this page(remote page) through tabs
<div id="container-2">
<ul>
<li><a href="#fragment-1a"><span>Section 1a</span></a></li>
[code]....
My Tabs are not showing up on my website just the plain links.
View 1 Replies View RelatedI'm working on a chat box. Everything works fine with the chat contents in a separate frame except when it reloads. I'm using the <meta> reload and I don't like how obvious the refresh is. Could someone tell me how I can refresh the frame without having the status bar and tabs showing it loading.
View 1 Replies View RelatedI have created three tabs to display different content in each.
Although I can click and go to the specific tab, but except the first 1 the other two tabs don't display any content or html that I have.
Can anyone find any problem in the code?
I have attached just the html. please excuse the structure of the code as it needs to be that way.
I use jquery to realize Tabs. As well, everything works fine.But here is my Problem If i try to open Tab_1 with an link on Content_4 nothing happens... Here is my Code:
jquery:
$(document).ready(function() {
$(".tabs a").click(function() {
[code]....
I'm looking for a tut on how to create tabs for content, not tabs for navigation/menu. Yes, kinda confusing, but here's an example of what I'm after code...
If you scroll down mid way, you will see a tabbed area where it provides the options to check out: Photos, Location, Aeriel and Street View. This is what I want to mimic (not the tabbed navigation up top in the menu bar).
Can you recommend any tutorials that would teach me how to do this?
Basically, I need jQuery tabs function but in a simple way, without the tab plugin etc.
However, this is slightly different to the solutions I found throughout Sitepoint. The catch is that I need to change two content containers. Plus the usual "activelink" class when clicked on a tab.
I've tried numerous things, mainly involing the index and n-th child selectors, just can't seem to make it work as a whole. I'd like to use that method in the end, if possible (ie. if the first link in <ul> is clicked then show the first <div> in div#tabs-cotainer and the first <div> in div#tabs-container-2)
It should ofcourse be able to parse as many links/contents as I put in there (probably with a ".each(function)").
Here's the example HTML:
HTML Code:
I read the jQuery doc but did not see if this is possible. The goal is to make 1 tab (when clicked) display content from all of the other tab containers. Don't know if this possible
View 3 Replies View RelatedI have 3 tabs that call an external ASP page that has a rather intensive Database query and takes a while to execute and display. On my tab there's a link to another page. once that page is finished the user goes back to the tab. But my problem is it's going back to the database page (that takes a while to execute).Can the original page be cached and remembered so that I dont have to keep calling my database page?
View 1 Replies View RelatedI'm trying to get basic JQuery tabs working, using the example shown on this website.If I put the example code on a page by itself it works exactly as intended. However, as soon as I try and incorporate that same code into my site its behaviour changes. The content for all three tabs appears on the one page and then when the page has finished loaded they then eventually hide.
<a href="http://www.allaboutthegames.co.uk/index2.php">Test page</a>
I use tabs, loading content by ajax. When I click on a tab, on first load, any access to objects like:
$("#my_input_text").val('my value')
Works fine, but if a click on another tab, and click again to theprevioustab, the same code don't update the input text.I think that is because the document has 2 inputs with the same id after second refresh.
To prove this, I did, on javascript console of firebug:
document.getElementById('my_input_text').id = "bad_my_input_text";
and$("#my_input_text").val('my value')
works again. Exist some way, when click on a new tab, before load a content, clean all data from previous tab?
Before the tab ui is loaded, I see the content of both tabs on the front page. Is there a way to fix this?[url]...
View 2 Replies View RelatedAnyone have any code examples or tutorials on how to implement POST's on the pages that each of the jQuery's Ajaxified tabs loads? Mainly looking for examples of the tab content pages post'ing/get'ing params.
here's an example of the stand-alone page that functions normally:[URL]...(select Oct. 8th, 2009 to see example or POST in action)
but when popped into an Ajax jQuery tab, the POST doesnt work[URL]...As you can see, on the second example, when the page POST's, it's no longer running in the tab. How do i get it to just refresh/POST within the tab?
[edit] i reformed my question above [/edit]
I have a column of links that use ajax to load content into the adjacent DIV, and I have used the loadobs function to load the JS and CSS files along with the external file. Now within the external file I have used javascript to create a 3 tab section; when you first load the page it is fine BUT if you navigate away from the page and then try going back and loading the same external page then the tabs stop working and all the content of the tabbed sections stack ontop of one another as though the javacript isnt working?
It is a work in progress but the page I am having the problems on can be found at [url] if you click on the top link in the left hand column called Tara - Female vocalist you will be able to see where the tabs are.
I found this vertical tabs functionality in jquery: [url]
Now it's nice and exactly what I was looking for, but I would like to know how to do the same exact thing in pure javascript. Can anyone link me to any tutorials that demonstrate how to achieve the same effect where content appears or disappears in a division of the page to the right of the tabs.
I'm
trying to make a web page with tabs which you can navigate between
without the page reloading. I have one set of tabs working great, but
when I add nested tabs there is a problem with the 'visibility' not
being inherited and some parts stay visible in the sub-tabs. Sorry if
this is unclear.
Here's how I have it layed out: I have a <span> for each content
section of a tab. Then I have do the same thing for the content of each
inner tab. When a tab is pressed some javascript code goes through and
makes all content sections hidden and the content section for the tab
that was pressed visible. If I select a tab and then select an inner
tab it looks like is should, but when I try and select a different tab
for the outer tabs the content for the inner section doesn't go away.
I've found that this is because visibility is not inherited. My
question is if anyone has a solution for this problem. I'm sure there
is somebody that knows of some javascript trickery to do this.
I need to create a page that
allows users to copy the contents of a MS Word document and paste them
into a textarea. All fine and dandy...but the tabs. I don't need to
keep the formatting, just the tabs. Is there any way to detect the tabs
and change them to four spaces or something similar? If you have any
other ideas please let me know.
I use this script wich works fine in FF, Opera and Chrome but not in IE!
<script type="text/javascript">
function DoAllThese() {
window.open('[URL]', 'One','_blank');
window.open('[URL]','Two','_blank');
}
</script>
<button onClick="DoAllThese();">Open</button>
Is it possible to do it in IE?
I have some Javascript code as shown below, I want this to open up two tabs in the browser with the associated url, that is all. However, the script below appears to run without doing anything, it does not redirect me to either the firstURL or thenext, as you can tell I am a novice.
<script type="text/javascript">
window.open('firstURL', "_blank");
window.open('anotherURL', "_blank");
</script>
I need to make a site, which will have 3 tabs. I need to be able to switch those tabs using ajax, but I have no clue how to do it. Can anyone help me? I attached an image showing what it would look like.
In each tab, there will be text links.
How can I make this script I generated with HomeSite, open links in new
windows/tab instead of the same? ....
I have a very basic web site directory that I'm organizing with tabs. I want the last option to "Show All" containers. I played with it a little but haven't figured it out yet. Here is the code. Can someone point me in the right direction? Note, I'm new to jquery so I'm a little clueless. [code]...
View 1 Replies View Related