Show Initial Layer
Feb 10, 2006
Below code creates a tabbed navigation. Works well. But how do I set it up so Tab 1 shows when the page is loaded?
Code:
<script type="text/javascript">
function initShowHide() {
if (document.getElementById && document.getElementsByTagName && document.createTextNode) {
hide();
var toggle = document.getElementById('toggle');
var as = toggle.getElementsByTagName('a');
for (var i = 0; i < as.length; i++) {
as[i].onclick = function() {
show(this);
return false;
}
}
}
}
function show(s) {
hide();
var id = s.href.match(/#(w.+)/)[1];
document.getElementById(id).style.display = 'block'
}
function hide() {
var toggleable = document.getElementById('toggleable').getElementsByTagName('div');
for (var i = 0; i < toggleable.length; i++) {
toggleable[i].style.display = 'none'
}
}
window.onload = initShowHide;
</script>
<style type="text/css">
#tabsB {
width:100%;
font-size:93%;
line-height:normal;
}
#tabsB ul {
margin:0;
padding:2px 10px 1px 0px;
list-style:none;
}
#tabsB li {
display:inline;
margin:0;
padding:0;
}
#tabsB a {
float:left;
background:url("tableftB.gif") no-repeat left top;
margin:0;
padding:0 0 0 4px;
text-decoration:none;
}
#tabsB a span {
float:left;
display:block;
background:url("tabrightB.gif") no-repeat right top;
padding:5px 15px 4px 6px;
color:#666;
}
/* Commented Backslash Hack hides rule from IE5-Mac */
#tabsB a span {float:none;}
/* End IE5-Mac hack */
#tabsB a:hover span {
color:#000;
}
#tabsB a:hover {
background-position:0% -42px;
}
#tabsB a:hover span {
background-position:100% -42px;
}
</style>
</head>
<body>
<table width="50%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
<tr>
<td><div id="tabsB">
<div align="left">
<ul id=toggle>
<li><a href="#1"><span>1 </span></a></li>
<li><a href="#2"><span>2</span></a></li>
<li><a href="#3"><span>3</span></a></li>
</ul>
</div>
</div></td>
</tr>
<tr>
<td bgcolor="#F7F7F7" style="border-bottom:1px solid #CCCCCC; border-left:1px solid #CCCCCC;border-right:1px solid #CCCCCC;">
<div id="toggleable">
<div id="1">Tab 2</div>
<div id="2">Tab 2</div>
<div id="3">Tab 3</div>
</div></td>
</tr>
</table>
View 1 Replies
ADVERTISEMENT
Dec 16, 2010
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");
}
View 1 Replies
View Related
Jul 20, 2005
Can someone help me figure out how to show a hidden layer *ONLY* if the
browser is IE for windows? I want it to remain hidden for everything else,
Netscape, Opera, Mozilla and anything for Mac. I'm not having much luck
out here.
View 4 Replies
View Related
Mar 1, 2010
I want the hidden layer to open when the visitor clicks and stay open until they click the close x. I can get the hidden layer to show onMouseover, but not onclick.
Code:
<script type="text/javascript"> // Copyright 2006-2007 javascript-array.com var timeout= 500; var closetimer= 0; var ddmenuitem= 0; // open hidden layer function mopen(id) { // get new layer and show it ddmenuitem = document.getElementById(id);
[Code]....
I find script that does something similar and adapt it to do what I need it to do. Usually, I can work it out on my own - but I have been working on this for several days now.
View 2 Replies
View Related
Jan 30, 2009
I'm looking to show/hide a layer in a 5 second rotation.
IE: For 5 seconds the layer is shown, then the next 5 seconds it is hidden, the next 5 seconds it is shown, the next 5 seconds it is hidden... {ad nauseum} - you get the idea.
How could I accomplish this with JavaScript? The layer id="overlay"
View 2 Replies
View Related
Jun 17, 2005
I'm using the scroll function with a layer containing a graphic that sits over the slider on the y axis. This works fine in IE but overhangs the lower scrollbar arrow in Netscape, Firefox and Opera, killing its functionality, so I'd like to hide it in these browsers.
Could someone show me the best way to work a function that says (taking the layer ID as 'Bar')
IF browser = IE
THEN 'Bar' = visible
or (better?)
IF browser <> IE
THEN 'Bar' = hidden
And how should I allow this to behave in Safari?
View 19 Replies
View Related
Aug 6, 2005
Found a simple script to show and hide layers. Using this to have an ad with 60px height and onMouseOver 350px
function adtechhideElement(elmID)
{
for (i = 0; i < document.all.tags(elmID).length; i++)
{
obj = document.all.tags(elmID)[i];
if (! obj || ! obj.offsetParent) continue;
obj.style.visibility = "hidden";
}
}
function adtechshowElement(elmID)
{
for (i = 0; i < document.all.tags(elmID).length; i++)
{
obj = document.all.tags(elmID)[i];
if (! obj || ! obj.offsetParent) continue;
obj.style.visibility = "";
}
}
but the thing is this doesn't work in firefox/mozilla.
Where should I alter this to get it working in firefox?
View 3 Replies
View Related
Apr 4, 2002
Layer writing in Netscape. This is pretty straightforward >> However I'm trying to write to a <div> layer within a <div> layer.
My div:
Code:
<div id="blah">
<div id="aight">
</div>
</div>
I'm trying to write to "aight"
How should my code look?
View 3 Replies
View Related
Aug 16, 2010
I am trying to develop an exam system.Find my code below.I request you to copy the code and save it as an html file .I have 2 problems:
1. Kindly notice that when the quiz is loaded,it shows both the questions by default.I want only question 1 to be visible when the quiz loads.What happens presently is that ,both questions are visible even after I click on the link
Q.1( referring to question 1).However,when I click on
Q. 2,then only question 2 can be seen and then(after clicking on Q.2) if I click on Q.1,then only question 1 can be seen
What I want is that when the page loads only question 1 is visible.Then when I click on Q.2,I can see only question 2 and when I click on Q.1, I can see only question 1.I later plan on adding many questions,so it should be a general solution rather than a solution good only for 2 questions.
2.Also,what I want is that,if someone selects any of the answers of a particular question,it's link color should turn green to indicate to the user that he answered that question.So for,instance,if I select an answer to the first question(select one of London,New York,Seattle,Washington,Chicago), the link Q.1 should turn green.
View 3 Replies
View Related
Jan 30, 2009
I have created a floating layer using Javascript that remains always on top of page on scrolling.Issue is,at some point while scrolling,the layer flickers continuously.
The html page is as follows:
Many common software systems, JavaScript has a history of security problems. Many of these problems could allow a person with malevolent intent to steal sensitive information from a visitor. The number and type of such holes in security vary among browsers and operating system versions. Most JavaScript security holes have been caught and fixed, but new ones are being discovered all the time. For a list of current security holes check out your browser's and operating system's Web pages. As a Web site author, it is your responsibility to keep up-to-date on the current status of known security holes in the applications you create.
Signing Scripts. In Chapter 11, I explained that JavaScript does not provide the ability to directly access files on the client computer. This can be a very large hurdle to overcome if you're trying to upload a file to a server from the client computer. Fortunately, file uploading is one of many functional enhancements that signed scripts provide. Signed scripts are specially packaged scripts that have been verified and signed to be correct and non-threatening. These scripts have additional rights on the client computer that allow a programmer to do many things that he wouldn't otherwise be able to.
With the introduction of Netscape 4.0, a new security model was put in place that would allow digitally signed scripts to bypass some of the restrictions that had previously been placed on them. A signed script can request expanded privileges from the visitor and, with the visitor's permission, gain access to restricted data. A signed script requests these additional permissions through LiveConnect, which allows your JavaScript code to communicate with the Java Capabilities API. The security model allows JavaScript to access certain classes in Java in order to extend its functionality while still maintaining tight security for the client.
A digital signature is a fingerprint of the original programmer, and it allows the security model of the browser to detect where (or from whom) it originated. A script signer can be a person or an organization. By signing a script, you acknowledge yourself as the author and accept responsibility for the program's actions. A signed script contains a cryptographic checksum, which is just a special value that ensures the signed script has not been changed. When a digital signature is detected, you are assured that the code has not been tampered with since the programmer signed it.
Once you finish writing a script, you can use the Netscape Signing Tool to digitally sign it. Signing a script does the following:
Unambiguously assigns ownership of the script to a person or organization.
Allows an HTML page to use multiple signed scripts.
Places the signed script into a Java Archive (JAR) file.
Places the source of the script in the JAR file.
Once a user confirms the origin of the script and is assured that it has not been tampered with since its signing, he or she can then decide whether to grant the privileges requested by the script based on the validated identity of the certificate owner and validated integrity of the script.
JAVASCRIPT FILE IS AS FOLLOWS:
AND CSS FILE IS AS FOLLOWS:
At some point while scrolling,the div 'movable' flickers continuously,while at some other point,it is perfectly stable.
View 11 Replies
View Related
Aug 17, 2010
I was wondering if there is a javascript that will generate random initial value of my field in form, but it should make random choice of values that i specify in script.
View 14 Replies
View Related
Jun 21, 2011
If I have an external file containing this kind of information code...
Am I going in the right direction?
Is this possible using JS without retyping my initial database?
View 5 Replies
View Related
Apr 19, 2011
I'd like to know how I can produce an initial animation.I want animate a div automatically when the page is opened.I can animate my div associating the animation, for example, to a button or to a mouseover action, but i can't create an automatic animation.[code]
View 1 Replies
View Related
Aug 2, 2011
I'd like to fadeIn an image when I click on an li element, but I don't seem to have the initial state of the image correct because I can't make it appear. I think the basic code is ok because if I change fadeIn to fadeOut and remove my attempts to make the image (img#bullet1Tip) invisible initially, I can click and fadeOut the image. This is my code:
[Code]...
View 9 Replies
View Related
Jun 23, 2010
Click on "Personal Pathways". Any idea why the jquery would start blinking on the first click, but load fine after?
It wasn't doing that at first, something changed, I went back through everything line by line removing and checking added elements but I'm stuck.
View 4 Replies
View Related
Dec 23, 2009
need help in making a check box list menu, wherein when initial check box is clicked another checkbox will appear.
View 6 Replies
View Related
Mar 5, 2006
i want to copy gmail's auto save feature. i want to say 30 or so seconds after an onchange event, for it to call another function. i dont know how to do a timed event though and i was thinking that since the event happens over and over again as the user types, the 30 seconds would be restarted with every keystroke.
View 3 Replies
View Related
Nov 26, 2010
I have a simple web form with Name, email and subject. In the fields I have the values set to examples, like <input id=name value='John Smith'> What is the simplest way to have jQuery clear the field when I user clicks in the field, and then put the sample text back if the user does not enter anything in the field?
View 1 Replies
View Related
Jan 7, 2010
Why can I not change the initial picture from the menu? If I remove the initial image, the menu works as needed.[url]...
View 18 Replies
View Related
Jan 31, 2011
I'm a total jQuery noob, so I apologize if this question is really retarded.How would you select the initial index for the Cycle plugin? I've been digging around and I can't figure out how to make it not cycle to 0 automatically.
View 2 Replies
View Related
Dec 15, 2008
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 );
[Code]...
View 2 Replies
View Related
Jul 23, 2009
Is there a way to do it so that when listnav initially appears on the page, no items are shown? In other words, is there a way to just have the alphabetized index show with no initial display of anything else?
View 10 Replies
View Related
Nov 9, 2011
I have a form that I'm setting an initial value for every field using jQuery and the value of "title" attribute. When you click in the field, the initial value clears out. I need to validate the form, and make the user enter something in each field is indeed valid data.
View 5 Replies
View Related
Jul 4, 2011
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.
View 5 Replies
View Related
Feb 21, 2010
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');
[Code]...
View 1 Replies
View Related
Feb 17, 2009
javascript that would remove the initial value of a text field within a form once the web visitor clicks on it? Below is a link to the page in question as well as the code...
[URL]
[Code].....
View 2 Replies
View Related
