JQuery :: Tabs - All Content Loads First Then Hides?
Jan 12, 2011
I'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>
View 1 Replies
ADVERTISEMENT
Nov 9, 2009
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?
View 4 Replies
View Related
Nov 22, 2010
I have previously developed two scripts, both of which work really well, however I want to amalgimate them together if possible? My first script loads the content specified into a single div, replacing the content depending on which function is called, it also displays a loading gif during a timeout of 2 seconds. Here is the page:
[Code]...
View 1 Replies
View Related
Jun 10, 2011
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]...
View 2 Replies
View Related
Apr 1, 2011
We are looking to implement something similar to the navigation found at this site: [URL] When you click on ABOUT, CONTACT, or LAB, the appropriate div within the content-main div shows/hides as appropriate. Fancy. I'm happy to read up on this on my own, but I don't really know how they accomplished this, so I'm not sure what to research. Since the page doesn't refresh, I'm assuming AJAX may be involved? Most importantly, I'm very interested in how their URL structure works. It looks like #about is an anchor that they are linking to. I thought about doing it in PHP, which I'm more familiar with, but I'd rather not refresh the page if I don't have to.
View 9 Replies
View Related
Jan 15, 2011
I am writing some javascript that when the user clicks on a link, it hides or displays content inside a div tag. I have been trying to add some code that would only allow for one div tag to be displayed at a time.
Here is where I originally got the code [url]
Whenever I run this code I get this error:
This is the JavaScript that runs when the user clicks the link:
View 9 Replies
View Related
May 7, 2009
I expanded upon a script a friend helped me write, to create a simple check box that hides / shows content, as shown HERE. [URL] Unfortunately, I don't have a clue how to expand this, so that I can use more than one checkbox on the page, to open different sections.
<html>
<head>
<title>Title of page</title>
<script language="JavaScript">
function getCookie(NameOfCookie)
{ if (document.cookie.length > 0)
{ begin = document.cookie.indexOf(NameOfCookie+"=");
[Code]....
View 2 Replies
View Related
Sep 28, 2009
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD>
View 2 Replies
View Related
Nov 4, 2011
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]....
View 2 Replies
View Related
Oct 18, 2009
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:
View 9 Replies
View Related
Oct 27, 2009
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 Related
Dec 6, 2011
I 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 Related
Sep 21, 2010
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?
View 2 Replies
View Related
Apr 23, 2010
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 Related
Oct 27, 2009
Anyone 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]
View 1 Replies
View Related
Apr 2, 2009
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.
View 1 Replies
View Related
Jun 29, 2009
I have an ajax based page, which loads content from external page (html +js) So if i have a div "update_div" being updated with external content (html+js)
Let me be more specifig
Step1: Ajax content along with js loaded into update_div from a.html
Step2: Ajax content along with js loaded into update_div from b.html
What happens to the js loaded from a.html? Is it lurking in the memory or automatically/magically removed from the browser memory? I am afraid of memory leaks, if the js is still lurking in memory, the more ajax calls made, the more js is going to be held up in memory. Unless am totally wrong; i have no idea of the mechanism happening.
View 11 Replies
View Related
Sep 21, 2011
I have an ajax script which loads new content onto the page when the main navigation links is clicked. I also have a jquery script which fades divs in and out when another subset of links are clicked.
I guess these scripts essentially do the same thing but the first basically is loading in 'pages' without the page having to refresh. The second is just fading in and out divs that are on a page.
The problem is is that the second script only seems to work once, when the page is loaded.
Here they are:
View 2 Replies
View Related
Feb 11, 2011
I 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.
View 4 Replies
View Related
Oct 23, 2005
The content of my webpage is all contained in hidden divs. These divs are shown when a link in the nav bar is clicked. At the moment, ALL divs are hidden on page load, only the nav bar is visible. Is there a way to have one of the divs visable when the page loads? i.e the 'home' page.
function init(){
if(document.getElementById && document.createTextNode){
var mn=document.getElementById('nav');
var as=mn.getElementsByTagName('a');
for (var i=0;i<as.length;i++){
as[i]. false}
as[i]. false}
}
hidem();
}}
function show(l){
hidem();
var id=l.href.match(/#(w.+)/)[1];
document.getElementById(id).style.display='block'
}
function hidem(){
for (var i=0;i<document.getElementsByTagName('div').length;i++){
document.getElementsByTagName('div')[i].style.display='none'
}}
The function init() is called on page load.
View 4 Replies
View Related
Nov 21, 2005
I have created a link to a new pop up browser window from main site page using following javascript
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_openBrWindow(theURL,winName,features) { //v2.0
window.open(theURL,winName,features);
}
//-->
</script>
The code for the pop window is: <a href="#" onClick="MM_openBrWindow('alabaster/pop1.html','alabaster','width=490,height=630')">View large image</a>
The problem I am having is that on the main content page, you scroll down, click on link to pop up (page loads) but the main parent content jumps back to the top of page, meaning you have to scroll back down to where you were.
View 7 Replies
View Related
Dec 31, 2009
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?
View 2 Replies
View Related
Aug 27, 2010
I have imported css and link to my page. It works fine for all other browsers except Safari browser. When I am loading the page in Safari4 all the page content loads without style. My CSS hosted in CDN.
View 1 Replies
View Related
Sep 27, 2010
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.
View 1 Replies
View Related
Apr 9, 2010
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.
View 5 Replies
View Related
Mar 7, 2011
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.
View 9 Replies
View Related
