I am trying to hide tables when a page initially loads and only display them when a button is pressed. When the page loads the tables show and I need then to be hidden. What am I doing wrong? I am new to this.
Here is the code that I have so far.
<Script = text/javascript>
function show_hide(tblid, show) {
if (tbl = document.getElementById(tblid)) {
if (null == show) show = tbl.style.display == 'none';
tbl.style.display = (show ? '' : 'none');
I've almost finished employing the jQuery Accordian and Tabs UI functions on a website, but still have one remaining problem.I have a page using the UI tabs. When the page first loads the content of all the tabs flashes for a second or two and then the selected tab is displayed. After that the tabs work great with smooth transitions as expected.
The tabs on page load are filled with php include calls. Then I use ajax to refill the tabs base upon the users selections. That works fine without the load flashing of all tab contents. I did try switching all the php includes to jQuery ajax. The resulting page had the same problem with the content of all tabs flashing before the selected tab displayed.Here's some of my code:In the head:
Is my code the problem or is there something I'm leaving out that would hide the copy of the tabs loading until the document is ready and selects the first tab (index 0)?
I'm running into a little bit of a problem with tinyMCE. My textarea is not loaded with the initial first page load but dynamically inserted in the DOM via ajax, so it doesn't display.
I've studied the documentation that comes with tinyMCE and it still kinda puzzles me what I have to do to "dynamically load" tinyMCE.
Is there a way to edit the following show hide set up to allow for initial div to be open. So for example instead of nothing coming up, #video1 would initially load and then when you click on li links it would load a new div in as coded replacing the initial video for example, if you clicked video 2 or 3 thumbnails?
HTML= <ul id="brightCove"> <li onclick="javascript:doShowHide('video1');"> <a href="javascript://">video 1 thumbnail here</a> </li> <li onclick="javascript:doShowHide('video2');"> <a href="javascript://">video 2 thumbnail here</a> </ul><div class=showhide" id="video1"> content for video 1 </div> <div class="showhide" id="video2"> content for video 2 </div>
JS $(document).ready(function() { // Add ID of New Category in line below separated by Commas $("#video1,#video2").hide(); }); doShowHide = function(idstr) { $("div.showhide:visible").each(function () { if (this.id != idstr) $(this).hide("fast"); }); $("div.showhide#"+idstr).show("fast"); }
Basically, what I'm trying to do is set the left margin of an image based on the width of the image, because I want the image to appear centered relative to the link table above. I've been using this code: function insertImageMargin(){ var marg = getImageMargin(); document.getElementById("comic").style.marginLeft = marg + "px"; } function getImageMargin(){ var com = document.getElementById("comic"); return 440 - com.width / 2; } What happens is, the first time com.width is 0, but if I hit reload, it is the width of the image, and the code works correctly. How do I get this to work the first time.
I am currently using onload="document.getElementById("hidepage").style.visibility="hidden";" to try to hide a div box. Yet this will not work. I've tried FF, IEpp4 (IE platform preview 4) and IE9beta. This is the correct <div> id, and I do not know why this will not work.
I am using the Cascade plugin [URL]. I have been searching for a while and haven't found a solution to this yet. I am trying to set the initial selected option when the page loads.
I have my own library for web-design building - active forms, lists. I am going to build tabbing component. The complexity in this process is that all web forms uniformed and are built as TABLEs, where each field is TR. Tabs have to show/hide some of table rows.
I don't know how TR's properties must be changed in order to hide them all. I tried make HTML code like <TR>...</TR> .... <DIV id=tab1> <TR>...</TR> .... </DIV> <TR>...</TR> ....
And tried to change visibility of a DIV, but this doesn't work. How can I change visibility of set of TRs?
I'm not very good with Javascript so I need you help for page on my website. Basically what I need to do is to make a DIV shown only first time someone visits page, and then when he/she revisit it I want that same DIV hidden, and I want it hidden for next 24 hours... so in that way DIV would be shown only once a day, and only on first page load.
So to make that happen I need to do fallowing, and I would need your help for that: I need a script that on a page load checks if cookie (which is 24h cookie) is set, if it is then it should hide that DIV, if it is not set then it should set it, so that DIV would be hidden on next page load..
Im using iframes and i want to hide a url in my status bar while page loads. I have got many status bar scripts but all works after the url displaying in status bar.I want to hide a url on page load or a script that can hide/disable my status bar in I.E 8 , Mozilla and Chrome
I am trying to use javascript to hide a div before the page loads. Unfortunately for a brief second I can see the div on the page before the java script hide it. Is there anyway to set the javascript to hide the div before the page completely loads?
P.S. I'm using the hide function within the moo.fx.js file found @ http://moofx.mad4milk.net/. If there is an easier way to di by just write the javascript out in the onload function please let me know.
I've got a problem on a site using AJAX navigation where when you first request a page, parts of the script haven't been executed, but if you visit again, it's fine. Is there a common pitfall causing this problem?
I have small online shop and in the top section I have a mini cart, which a user can click on and expand an area to see what products they have added to their cart. The problem I am having is that for a brief moment when the page initially loads the expandable area becomes visible until I the .ready (hide) function kicks in. Is there any way that I can actually hide the cart on page initialisation so its not visible even for a brief moment?
I have a table with 1 row and 5 columns. I want to hide each column based on specific variables in the web page. Is there a way to do that. I tried a <div> tag and the below code, but it says you cannot put a <div> tag in a table etc.
onClick event binded on <li> tag with live() works fine. But I need to hide some tags immediately after ajax call. The jquery script is included together with some HTML code in returned HTTPrespons content data. Is it possible to do this without setting css display:none property?
I am working on a page currently:my test page. As you will see, i have a jcarousel slideshow loading on the right side of the homepage. You may also see that when the site loads, you can see the images in the UL list loading before they turn into the carousel. How can I hide this/clean this up?
I need to see if I can shorten this AND see if I can have a "show all option" added.The page is setup like so.. I have the following javascript working.. I'm running jquery... being a semi newbie it took a while to get this running.I have 4 DISTINCT queries that load up select boxes.There are 4 select boxes .. on change, the queries will see what option was selected and re-run DISTINCT SQL queries so all the select boxes only have related info.. so no one ends up with a "zero" results.I'm hiding these to help walk through in a logical order. However I need to1) Have a show all and let them select anything they wish and show all 4 boxes. How can I add a "show all" to the script below2) I noticed on page load the boxes show and then slowly hide. THis looks messy.. how can I alter that?3) This seems long for what I'm doing.. is there a way I can shorten this code? What if I expand to 8 boxes.. then I'll have 8 simple if statements.. but it seems unnecessary.CODE that is working is
$(document).ready(function () { if ($("#pMaterial option").is(":selected")) {
I'm stuck with a simple jquery accordion script that is[URL]..The problem is that there are links inside my divs that brings to another page where the same accordion menu should be included and left opened at the same state like the previous page (hope to be enough clear. The script I'm using will always close all the accordion divs upon the second page load. I'm a total newbie of jquery and couldn't understand exactly how jquery works (among other things I've to do i promise that I will learn jQuery as soon as possible );
I have a scripts which filters a list of data based on a users selection from dropdowns in a form. The script updates a counter while the user is making the selections and also colates a url string which I then use to query a php db when the user clicks view results.
I also have a reset button in the form so the user can quickly go back to the start. When this is clicked it does reset all the dropdowns and inputs to their defualt values but it doesn't reset my js functions back to their initial states.
Can anyone tell me how I can do this? Is there a js reset function I can use?
Before the home page of a site i've developed appears, I want the logo of the company to appear on the screen, then fade out to reveal the web page with full functionality. I also could do this be fading out the logo to reveal a static image of the home page which then could redirect to actual home page.
I have a single webpage that contains information on all 50 U.S. states. There are 50 links at the top to jump down to the state you want, and at the bottom of the information for each state a Back to Top link.
I'm making the Back to Top link into something more complex, and it will require three or four lines of code.
So that I don't have to repeat the code 50 times, and create a burden when I need to edit it, I want to place it in a .js file and call it x. Then below the information for each state I'll simply have:
Does calling code from a .js file 50 times slow down the page load? Which method would load faster?
I am using the excellent jquery.tablesorter successfully for a large number of 40-row tables that live together on one page. So far I'm very happy with the plugin. My users also need the ability to apply any column sort they invoke automatically to *all* tables on the pae. They do not wish to sort the tables individually. As recommended in another thread, I have been looking at sortStart and sortEnd, but have been pulling my hair out trying to get this working. My JS:
<script type="text/javascript" charset="utf-8"> $(document).ready(function() { // extend the default setting to always sort on the first column $.tablesorter.defaults.sortList = [[0,0]];
