|
JavaScript - 1 Link To Open Multiple In Forum (semi-complicated)
Hello Everyone.
I have a bit of an issue trying to get one link to open more than one link at a time. Perhaps you can either help me or suggest a better way to do so. I have created a table with hidden rows until a user clicks an open in either cell. Once the user clicks a cell, the next row of opens opens up. What I am having trouble with is getting the table headings to be opened once hidden. Each set of options needs a title or question for the user to understand what choices to make. (these are the td's with colspan of 2) I am using javascript to show and hide the cells I have so far, and I can hide them just fine, I just want to show both sets of cells once the user clicks one link. its a bit complicated because i have functions all over the place Any help you give me would be greatly appreciated. Alternatively, I can be reached on Y!: tmdela Here's the code...: <html> <head> <script language="JavaScript"> function showCell() { document.getElementById('cellName').style.visibility='visible'; } function showCell2() { document.getElementById('cellName2').style.visibility='visible'; } function showCell3() { document.getElementById('cellName3').style.visibility='visible'; } function showCell4() { document.getElementById('cellName4').style.visibility='visible'; } function showCell5(){ document.getElementById('cellName5').style.visibility='visible'; } function showCell6(){ document.getElementById('cellName6').style.visibility='visible'; } function DoAllThese12(){ showCell(); showCell2(); showCellHeader(); } function DoAllThese34(){ showCell3(); showCell4(); } function DoAllThese56(){ showCell5(); showCell6(); } </script> <!--------------------------------CSS begins here, hides the table--> <style type="text/css"> #cellName {visibility:hidden; } #cellName2 {visibility:hidden; } #cellName3 {visibility:hidden; } #cellName4 {visibility:hidden; } #cellName5 {visibility:hidden; } #cellName6 {visibility:hidden; } body{ font-family:Arial, Calibri, Sans-serif; font-size: 15px; } a{ font-family: Arial, Calibri, Sans-Serif; font-size: 11px; color:#000; } a:link{text-decoration:none} a:visited{text-decoration:none; color:#000;} a:active{text-decoration:none} a:hover{text-decoration:none;} a:visited { color: #000; } #container{ position:absolute; margin:0 auto; left: 30%; top:0px; } #maincontent{ width: 420px; margin: 0 auto; } #table{ margin:0 auto; width: 450px; } td { width: 50%; border:0px; } .pane-list { margin: 0; padding: 0; list-style: none; } .pane-list li { background: #f9dfec; padding: 10px 20px 2px; border-top: solid 2px #FF0066; cursor: pointer; } .pane-list li:hover { background: #F6A8B6; } </style> </head> <!--------------------------------------------body--> <body> <div id="container"> <div id="maincontent"> <h3>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer id ante eu nunc aliquet malesua</h3> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer id ante eu nunc aliquet malesuaLorem ipsum dolor sit amet, consectetur adipiscing elit. Integer id ante eu nunc aliquet malesuaLorem ipsum dolor sit amet, consectetur adipiscing elit. Integer id ante eu nunc aliquet malesuaLorem ipsum dolor sit amet, consectetur adipiscing elit. Integer id ante eu nunc aliquet malesua </p> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer id ante eu nunc aliquet malesuaLorem ipsum dolor sit amet, consectetur adipiscing elit. Integer id ante eu nunc aliquet malesuaLorem ipsum dolor sit amet, consectetur adipiscing elit. Integer id ante eu nunc aliquet malesuaLorem ipsum dolor sit amet, consectetur adipiscing elit. Integer id ante eu nunc aliquet malesua </p> <BR> </div><!--maincontent--> <!-------------------------------------Container for table--> <div id="menu"> <!-------------------------------------Line 1 of table: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer id ante eu nunc aliquet malesua?--> <div id="table"> <center> <table border="0" id="table"> <tr> <td colspan="2">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer id ante eu nunc aliquet malesua? </td> </tr> <td> <ul class="pane-list"> <li> <h3> <a href="#" onclick="DoAllThese12()">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer id ante eu nunc aliquet malesua <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer id ante eu nunc aliquet malesua</p> </a> </h3> </li> </ul> </td> <td> <ul class="pane-list"> <li> <h3> <a href="http://www.google.com">My cancer has spread. <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer id ante eu nunc aliquet malesua</p> </a> </h3> </li> </ul> </td> </tr> <!------------------------------------Line 2 of Table: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer id ante eu nunc aliquet malesua--> <tr> <td colspan="2">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer id ante eu nunc aliquet malesua? </td> </tr> <td id="cellName"> <ul class="pane-list"> <li> <h3> <a href="#" onclick="DoAllThese34()">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer id ante eu nunc aliquet malesua</a> </h3> </li> </ul> </td> <td id="cellName2"> <ul class="pane-list"> <li> <h3> <a href="http://www.google.com">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer id ante eu nunc aliquet malesua</a> </h3> </li> </ul> </td> </tr> <!------------------------------------Line 3 of Table: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer id ante eu nunc aliquet malesua--> <tr> <td colspan="2">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer id ante eu nunc aliquet malesua? </td> </tr> <tr> <td id="cellName3"> <ul class="pane-list"> <li> <h3> <a href="#" onclick='DoAllThese56()'>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer id ante eu nunc aliquet malesua</a> </h3> </li> </ul> </td> <td id="cellName4"> <ul class="pane-list"> <li> <h3> <a href="#" onclick="DoAllThese56()">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer id ante eu nunc aliquet malesua</a> </h3> </li> </ul> </td> </tr> </table> </center> </div><!--table--> </div><!--menu--> </div><!--container--> </body> </html> Similar TutorialsHow can I let link page open using IE? for example, I open a webpage using firefox or chrome/opera/safari. when I click the link, open the link using IE <html xmlns="http://www.w3.org/1999/xhtml"> <head id="Head2" runat="server"> </head> <body> <a href="#" onClick="window.showModalDialog ('http://www.google.ca','','width=600,height=600','screenx=200','screeny=200')"><img src="images/benemanc-01th.jpg" alt="img-01" width="125" height="155" class="thumb" style="display:inline"></a> </body> </html> Many thanks T Hello folks! I don't know anything about JavaScript but I found a really cool snippet I use a lot. It will randomize images and each image can open a new link. It looks like this: ---------------------------------------------------- <script language="JavaScript" type="text/javascript"> function random_imglink(){ var myimages=new Array() myimages[1]="/img/images1.jpg" myimages[2]="/img/images2.jpg" myimages[3]="/img/images3.jpg" var imagelinks=new Array() imagelinks[1]="http://www.google.com" imagelinks[2]="http://www.yahoo.com" imagelinks[3]="http://www.alexa.com" var ry=Math.floor(Math.random()*myimages.length) if (ry==0) ry=1 document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" border=0></a>') } random_imglink() //--> </script> ------------------------------------------------- Now, my question is, can I link to open a document within an iFrame on my page? Please don't tell me not to use iframes or whatever, I'm not a professional, just want to see if this works. hi experts, I need to open same url (flash streaming site) on multiple tabs (min 100 tabs) without crashing my browser or drinking all my cpu usage. Pls dont ask me why i need to open like that. The question is can it be done. Thanks Hello, I have some code to open 1 dialog box. Could someone please help me manipulate this code to open multiple boxes with different contents. I would like to do this with out duplicating the existing code, maybe setting a variable. The least amount of code the better. Thanks in advance. Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/themes/base/jquery-ui.css">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/jquery-ui.min.js"></script>
</head><body>
<div id="dialog" title="Example dialog">
<p>Some text that you want to display to the user.</p>
</div>
<script type="text/javascript">
$(document).ready(function() {
$("#dialog").dialog({
bgiframe: true, autoOpen: false, height: 100, modal: true
});
});
</script>
<a href="#" onclick="jQuery('#dialog').dialog('open'); return false">Click here to see the popup</a>
</body>
</html>
Hi guys, i hope u can help me. This is the link(and i have a function called check_group): Code: <a href="javascript:viod(0)" onclick="check_group('<?php echo $codart ?>','<?php echo $codfam ?>')"><?php echo $gname?></a>
I have a function called check group. I want to open that link in a new window. Thanks. I have a php page which uses the following javascript code to open another page (The users profile page) and alos carry over the userID (dUid) Code: var userProfileUrl = chatProfileUrl+dUid.replace(/_/gi,"");
document.getElementById('userdetails').innerHTML += "<span class='userinfo' onClick=\"window.open('"+userProfileUrl+"','"+dUid+"')\"><img id='profile' style='cursor:pointer;vertical-align:middle;padding-top:4px;' src=images/zoom.png> View Profile</span></br>";
I wanted to add to the menu another image link so I copied the same coding, but I do not know where to place the URL target that I want opened. I know I want the userID (dUid) also to follow this link as well. If I want the coding below to act in the same manner as the coding above, but instead open a page called /gift.php, where do I set the Url? Code: document.getElementById('userdetails').innerHTML += "<span class='userinfo' onClick=\"window.open('"+userProfileUrl+"','"+dUid+"')\"><img id='profile' style='cursor:pointer;vertical-align:middle;padding-top:4px;' src=images/gift.png> Send Gift</span></br>";
Hi All, Im a newbie when it comes to Javascript and trying to learn as I go along. I am working on an internal work site. In the site I have a text box and on entering a specific code I want it to open a new page that links to a document that has the same name. ie. if user types red, I want it to find the document red.html in a folder. To make my colleagues job easier, I want the text box to autocomplete. Below is a section of the code I plan to use Code: <script> var arrValues = ["red", "orange", "yellow", "green", "blue", "indigo", "violet", "brown"]; </script> </head> <body> <h2>Autocomplete Textbox Example</h2> <p>Type in a color in lowercase:<br /> <input type="text" value="" id="txt1" onkeypress="return autocomplete(this, event, arrValues)" /></p> </body> </html>Can anyone help me to modify this to: 1) link the text entered to the document I want opened 2) open this document upon 'enter' pressed If anyone can provide help it will be greatly appreciated. Thanks Glen Hi this is my first post i dont know were to post it any way hope you can help me out ok the thing is that i got this script <script> alert("mesages"); document.location = "http://google.com"; </script> easy script but when you click button it takes you the the URL but i want it in a new tab plz help and sorry if this was posted in a new section i try google this but not luck I have two pages A and B. I have a link in the page A. I have two iframes in the page B. In practice, the link in the page A must open the page B and the link's href must open in the second iframe of the page B. Is there any script that does this? Please help me make the links below open in the "top" or "parent" frame of a window. For example, in HTML, you would use
Code: <a href="URL" target="_top">LINK</a> I just do not know how to make the links below perform in the parent window. (or even a new window if that is only possible.) Code: var $el, $tempDiv, $tempButton, divHeight = 0;
$.fn.middleBoxButton = function(text, url) {
return this.hover(function(e) {
$el = $(this).css("border-color", "white");
divHeight = $el.height() + parseInt($el.css("padding-top")) + parseInt($el.css("padding-bottom"));
$tempDiv = $("<div />", {
"class": "overlay rounded"
});
$tempButton = $("<a />", {
"href": url,
"text": text,
"class": "widget-button rounded",
"css": {
"top": (divHeight / 2) - 7 + "px"
}
}).appendTo($tempDiv);
$tempDiv.appendTo($el);
}, function(e) {
$el = $(this).css("border-color", "#999");
$(".overlay").fadeOut("fast", function() {
$(this).remove();
})
});
}
$(function() {
$(".widget-one").middleBoxButton("Action Games","action.htm");
$(".widget-two").middleBoxButton("Adventure Games", "adventure.htm");
$(".widget-three").middleBoxButton("Arcade Games", "arcade.htm");
$(".widget-four").middleBoxButton("Puzzle Games", "puzzle.htm");
$(".widget-five").middleBoxButton("Sport Games", "sport.htm");
$(".widget-six").middleBoxButton("Search Games", "searchgames.htm");
});
Thank you very much for your help!!! Hi, I am working with the Cut & Paste JavaScript Slideshow which you can find on http://javascriptkit.com/script/script2/jsslide.shtml . The images are linked to a page on the Internet (click on image1 to go to "page1", click on image2 to go to "page2", etc.) which is a nice feature! However, the link opens in a new window. Could anyone tell me what I have to do to 'force' the link to open in the same window (target="_self")? Thank you for your help! I really appreciate it. WWWolf - Belgium Hi, I have long polling functionality working with Google Desktop Notifications. http://blog.perplexedlabs.com/2009/0...-long-polling/ However if I have multiple tabs open then the Notification received from the server is duplicated on every tab. Is there way to prevent this from happening as it should only appear once? Thanks Hi all , I need some help in altering the location tag and the View Larger Map links to open in a new window, currently it opens in the same window. I didn't set any links myself, they were already in the code that I got from Google Maps, I placed it on my page as a custom script. I tried to edit it myself and other frames on my page got all muddle up in preview !!!!! _THE CODE_ <iframe width="350" height="280" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.com/?ie=UTF8&ll=37.109574,-8.030563&spn=0.011328,0.022724&t=h&z=16&output=embed"></iframe><br /><small><a href="http://maps.google.com/?ie=UTF8&ll=37.109574,-8.030563&spn=0.011328,0.022724&t=h&z=16&source=embed" style="color:#0000FF;text-align:left">View Larger Map</a></small> Code: oaktree.addItem("RC Mail", branch1, "rcmail/") //Add this item to branch2
I can open it up in the current page, but the menu is in a frame and I need to open it in a fram called "home". How can I do that~?? Hello, I've tried various things I've found online but cannot seem to get the right code to open the links in a drop down menu in a new window. Code: <form id="quicklinks" name="quicklinks" action="">
<select name="quicklinkitem" onchange="openWin(quicklinkitem.value)">
<option value="/lib/board.html">Select a Date</option>
<option value="/lib/boardreports/03-08-12.pdf">March 8, 2012</option>
<option value="/lib/boardreports/02-09-12.pdf">February 9, 2012</option> </select>
</form>
I appreciate any help. Elbee I have a map with hotspots, and when you hover over a hot spot, a hidden DIV appears. Thanks to my favorite coding forum, this one, I was able to successfully accomplish this first bit of code. The only problem I'm having now is getting the DIV to remain open while I move my mouse from the hotspot to the DIV. As soon as I move my mouse away from the hotspot, the DIV disappears. I need to put links in the DIVs, and users will need to be able to move their mouse away from the hotspot to click on the link, but currently can't. I experimented with setTimeout, but didn't get too far. If anyone could help me, I'd appreciate it. I really need to get this working. Code: <img src="images/map.png" alt="" usemap="#map"/> <map id="map" name="map"> <area shape="rect" coords="211,84,225,97" href="#" alt=""/> <area shape="rect" coords="226,78,240,92" href="#" alt=""/> <area shape="rect" coords="353,66,376,89" href="#" alt=""/> </map> <div id="hidden"> <div class="location" style="left:25px; top:-290px;"> <img src="images/location01.jpg" alt=""/> </div> <div class="location" style="left:25px; top:-275px;"> <img src="images/location02.jpg" alt=""/> </div> <div class="location" style="left:275px; top:-285px;"> <img src="images/location03.jpg" alt=""/> </div> </div> <!-- #hidden --> Code: function show(which) {
var area = document.getElementById("map").getElementsByTagName("area");
var locations = document.getElementById("hidden").getElementsByTagName("div");
for (var a=0; a < area.length; ++a) {
if(area[a] == which) locations[a].style.display="block";
}
}
function hide() {
var locations = document.getElementById("hidden").getElementsByTagName("div");
for (var d=0; d < locations.length; ++d) {
locations[d].style.display="none";
}
}
function init() {
var area = document.getElementById("map").getElementsByTagName("area");
for (var a=0; a < area.length; ++a) {
area[a].onmouseover = function() { show(this); }
area[a].onmouseout = hide;
}
}
window.onload = init;
Came upon this code recently: Code: soundManager.onready(function() {
if (soundManager.supported()) {
var mySound = soundManager.createSound({
id: 'introSound',
url: 'someURL'
});
mySound.play();
} else {
alert("If you continue to see this error message, check to see if JavaScript is enabled.");
}
});
My question is, is the last bracket and semi-colon necessary? The else statement is not creating a variable, so why include it? The author seems to think so. Maybe I should know something. Hi guys, i have posted this problem yesterday but maybe it just wasnt clear enough on what i wanted to acheiv. basically i have 1 link throughout my site and its a "buy now" button. i want it to be able to fetch possibly a value out my page content and then depending on that content direct the user to the correct page when they click that button? is this feasible? cheers, ant. Hi, I'm currently trying to incorporate several random link generators on one page, each with different links to be directed to. However, at the minute all the links just direct me to the URLs of the most recent random link to be created. If someone could point me in the right direction to fixing this that would be great! The code I am currently using is: Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<script type="text/javascript">
var movie=new Array()
movie[0]="http://bringbacktheoc.weebly.com"
movie[1]="http://allaboutkarl.weebly.com"
movie[2]="http://recipeshareonline.weebly.com"
function randomLinks(elem)
{
var randomLink=Math.floor(Math.random()*2);
elem.href=movie[randomLink];
elem.target = "_blank";
}
</script>
<a href="#" onclick="randomLinks(this)"<p><font size="20" > 1 </font><p> </a>
</body>
</html>
Thanks! Hello! I am trying to find a script that allows you to open multiple browser tabs and then close each of those tabs, either one by one or all at once. Does anyone know how to do this please? Thanks so much for your help. |
|||||||