JavaScript - Display Issue In Ie, Fine In Ff
I won't even pretend to know what I'm doing. I'm just trying to update a few things on our company's website. We implemented live chat and some new graphics to accomodate our banner.
We use two main index files (one sorts by category and the other by manufacturer). Originally these two files along with every single product page referenced the banner code from a javascript file named: header.js This is fine in firefox but IE isn't too thrilled with it and does something fairly strange (at least to me). Here's a link to the problem (open in IE): http://www.alamomotorsports.com/act/act.html Here is the Java code Code: <div id="header_container"> <div id="header"> <div id="header_lh_cell"><a href="http://www.alamomotorsports.com"><img src="http://www.alamomotorsports.com/images/AMSTopper.jpg" alt="Jump to the Alamo Motorsports Homepage" /></a></div> <div id="header_center_cell">Orders over $150<br /><span class="bam">Ship Free!</span>*<br /> <img src="http://www.alamomotorsports.com/images/multicard_bk_allt.gif" alt="Alamo Motorsports accepts Visa, Mastercard, and American Express" /></div> <div id="header_rh_cell" class="header_footer_links"> Customer Support:<br /> <span class="bam">800-880-0960</span><br /> <form> <input type="button" value="Email Us!" onClick="window.open('/emailus.html','mywindow','width=600,height=500')"> </form> </div> Also: Code: document.writeln("<div id=\"header_container\"> <div id=\"header\"> <div id=\"header_lh_cell\"><a href=\"http://www.alamomotorsports.com\"><img src=\"http://www.alamomotorsports.com/images/AMSTopper.jpg\" alt=\"Jump to the Alamo Motorsports Homepage\" /></a></div> <div id=\"header_center_cell\">Orders over $150<br /><span class=\"bam\">Ship Free!</span>*<br /> <img src=\"http://www.alamomotorsports.com/images/multicard_bk_allt.gif\" alt=\"Alamo Motorsports accepts Visa, Mastercard, and American Express\" /></div> <div id=\"header_rh_cell\" class=\"header_footer_links\">Customer Support:<br /><span class=\"bam\">800-880-0960</span><br /><form> <input type=\"button\" value=\"Email Us!\" onClick=\"window.open('/emailus.html','mywindow','width=600,height=500')\"> </form></div> <div id=\"header_menu\"> <ul id=\"category\"> <li><a href=\"http://www.alamomotorsports.com/indexcat.html\">Shop By<br />Category</a></li> </ul> <ul id=\"manufacturer\"> <li><a href=\"http://www.alamomotorsports.com/indexman.html\">Shop By<br />Manufacturer</a></li> </ul> <ul id=\"info\"> <li><h2> <br />Info</h2> <ul> <li><a href=\"http://www.alamomotorsports.com/contact_info.html\">Contact Us</a></li> <li><a href=\"http://www.alamomotorsports.com/blowout.html\">Blowout Sale</a></li> <li><a href=\"http://www.alamomotorsports.com/disclaim_shipping.htm\">Our Policies</a></li> <li><a href=\"http://www.alamomotorsports.com/links.html\">Links</a></li> <li><a href=\"http://www.alamomotorsports.com/most_popular.html\">Most Popular</a></li> </ul> </li> </ul> <ul id=\"showcart\"> <li><a href=\"http://www.cartserver.com/sc/cart.cgi?item=a-2309&view.x=1\">Show My<br />Shopping Cart</a></li> </ul> <ul id=\"search\"> <li><form method=\"get\" action=\"http://www.alamomotorsports.com/cgi/search.pl\"> <h2><label for=\"fdse_TermsEx\" >Search for: </label> <input name=\"Terms\" id=\"fdse_TermsEx\" /> <input type=\"submit\" value=\"Go\"> </h2> </form> </li> </ul> </div><!--header_menu--> </div><!--header--></div><!--header_container--><div id=\"content_container\"><div id=\"content\">"); Thank you for help in advance. Similar TutorialsJavascript: Code: function hoverMenu(listItem, menuName) { if (document.getElementById(menuName).isActive == "1") { var listItemHeight = document.getElementById(listItem).offsetHeight; var itemTop = document.getElementById(listItem).offsetTop; var itemLeft = document.getElementById(listItem).offsetLeft; document.getElementById(menuName).style.top = itemTop + listItemHeight + "px"; document.getElementById(menuName).style.left = itemLeft + "px"; document.getElementById(menuName).style.display = "block"; document.getElementById(menuName).style.opacity = "1.0"; document.getElementById(menuName).isActive = "0"; } else { var listItemHeight = document.getElementById(listItem).offsetHeight; var itemTop = document.getElementById(listItem).offsetTop; var itemLeft = document.getElementById(listItem).offsetLeft; document.getElementById(menuName).style.top = itemTop + listItemHeight + "px"; document.getElementById(menuName).style.left = itemLeft + "px"; document.getElementById(menuName).style.display = "block"; menuFade(menuName); document.getElementById(menuName).isActive = "0"; } } function hoverMenuTier2(listItem, menuName) { if (document.getElementById(menuName).isActive == "1") { var itemTop = document.getElementById(listItem).offsetTop; var itemLeft = document.getElementById(listItem).offsetLeft; document.getElementById(menuName).style.top = itemTop + "px"; document.getElementById(menuName).style.left = itemLeft + "px"; document.getElementById(menuName).style.display = "block"; document.getElementById(menuName).style.opacity = "1.0"; document.getElementById(menuName).isActive = "0"; } else { var itemTop = document.getElementById(listItem).offsetTop; var itemLeft = document.getElementById(listItem).offsetLeft; document.getElementById(menuName).style.top = itemTop + "px"; document.getElementById(menuName).style.left = itemLeft + "px"; document.getElementById(menuName).style.display = "block"; menuFade(menuName); document.getElementById(menuName).isActive = "0"; } } function hideThis(menuName) { document.getElementById(menuName).style.display = "none"; document.getElementById(menuName).style.opacity = "0"; } function showMenu(menuName) { document.getElementById(menuName).style.display = "block"; document.getElementById(menuName).style.opacity = "1.0"; document.getElementById(menuName).isActive = "1"; } HTML: Code: <div id='db-sub' class='ddm-db' onmouseover="showMenu('db-sub');" onmouseout="hideThis('db-sub');"> <ul> <a href='#'><li id='dba' class='sub'>1</li></a> <a href='#'><li class='sub'>2</li></a> <a href='#'><li class='sub'>3</li></a> <a href='#'><li class='sub'>4</li></a> <a href='#'><li class='sub'>5</li></a> <a href='#'><li class='sub'>6</li></a> <a href='#'><li class='sub'>7</li></a> <a href='#'><li class='sub'>8</li></a> <a href='#'><li id='dbq' onmouseover="hoverMenuTier2('dbq', 'dbq-sub');" onmouseout="hideThis('dbq-sub');" class='submenuArrow'>9</li></a> <a href='#'><li class='sub'>10</li></a> <a href='#'><li class='sub'>11</li></a> <a href='#'><li class='sub'>12</li></a> <a href='#'><li class='sub'>13</li></a> </ul> </div> The remaining HTML for the the 'dqb-sub' element that is displayed follows an identical format to 'db-sub'. Mousing over the upper elements produces a drop-down menu that is aligned with the position of the top-most element in question. Mousing over the 'dbq' element produces the element 'dbq-sub' at the (0,0) position of the window, which is my issue. I believe it has to do with the fact that I'm setting the display property to 'none', which essentially destroys the element, along with its properties. What doesn't make sense is that while the 'db-sub' element is set to a block display type, it should have valid, non-zero offsets. I'd like the 'dbq-sub' element to position based on where the 'dbq' element is. Any ideas? Hello all, I'm trying to set up a web page to display a video when a user clicks on a link. So far, it works fine in IE and Chrome, but it won't work in Firefox. Any ideas? http://tinyurl.com/6u3jnq5 ok heres a regex Code: /^(?=.*\d)(?=.*[A-Z])(?=.*[a-z]).{8,16}$/ which checks I have at least one lowercase letter, one uppercase letter and one number and the string is between 8 and 16 characters. I have adapted this from another source and it works as intended on all browsers but not IE7 or IE6 (oh microsoft why do you make my life so hard) Any ideas? This works fine in all other browsers (IE8 is fine) but doesnt work in IE6 or IE7 I'm (experimenting) writing my own RTE in JavaScript, I'm doing pretty good until it comes to the commands, the execCommand method. Here's what I have so far: Code: function get(editid) { // IE if(document.frames[editid].document) return document.frames[editid].document; else return document.getElementById(editid).contentDocument; } function ini(edit) { get(edit).designMode = "On"; } function xC(edit, cmnd, arg) { get(edit).execCommand(cmnd, false, arg); } The xC (execute command) function is not working! I've tried so much. Any ideas? I could use some help getting the following code to work... As is, it works fine in google chrome, but not at all in Internet Explorer 9. If I paste my code into w3schools "tryit" window, it will work great if it has less than 6 rows, any more and I get a generic "ERROR" on the screen. javascript code Code: <script type="text/javascript"> Number.prototype.formatMoney = function(c, d, t){ var n = this, c = isNaN(c = Math.abs(c)) ? 2 : c, d = d == undefined ? "," : d, t = t == undefined ? "." : t, s = n < 0 ? "-" : "", i = parseInt(n = Math.abs(+n || 0).toFixed(c)) + "", j = (j = i.length) > 3 ? j % 3 : 0; return s + (j ? i.substr(0, j) + t : "") + i.substr(j).replace(/(\d{3})(?=\d)/g, "$1" + t) + (c ? d + Math.abs(n - i).toFixed(c).slice(2) : ""); }; function getRowCount() { return document.getElementById('myTable').rows.length; } function changeContent() { var lastRow = getRowCount(); var colSum=0; for(var e=1;e<=lastRow;e++){ var x=document.getElementById('myTable').rows[e].cells; p1=document.getElementById('p'+e).value; q1=document.getElementById('q'+e).value; outint = p1*q1; var out='<input type="text" value="'+Number(outint).formatMoney(2, '.', ',')+'" disabled="disabled">'; x[3].innerHTML=out; } } </script> html code Code: <table width="600" border="1"> <tr> <td>Item Name</td> <td>Price per unit</td> <td>Number of Units</td> <td>Total Price</td> </tr> <tr> <td>Item 1</td> <td><input type="text" id="p1" value="8.3930" disabled="disabled"></td> <td><input type="text" id="q1" value="0" onchange="changeContent()"></td> <td><input type="text" id="t1" value="0" disabled="disabled"></td> </tr> <tr> <td>Item 2</td> <td><input type="text" id="p2" value="8.3380" disabled="disabled"></td> <td><input type="text" id="q2" value="0" onchange="changeContent()"></td> <td><input type="text" id="t2" value="0" disabled="disabled"></td> </tr> <tr> <td>Item 3</td> <td><input type="text" id="p3" value="62.3260" disabled="disabled"></td> <td><input type="text" id="q3" value="0" onchange="changeContent()"></td> <td><input type="text" id="t3" value="0" disabled="disabled"></td></tr> <tr> <td>Item 4</td> <td><input type="text" id="p4" value="124.6630" disabled="disabled"></td> <td><input type="text" id="q4" value="0" onchange="changeContent()"></td> <td><input type="text" id="t4" value="0" disabled="disabled"></td></tr> <tr> <td>Item 5</td> <td><input type="text" id="p5" value="1554.4320" disabled="disabled"></td> <td><input type="text" id="q5" value="0" onchange="changeContent()"></td> <td><input type="text" id="t5" value="0" disabled="disabled"></td> </tr> <tr> <td>Item 6</td> <td><input type="text" id="p6" value="2622.6750" disabled="disabled"></td> <td><input type="text" id="q6" value="0" onchange="changeContent()"></td> <td><input type="text" id="t6" value="0" disabled="disabled"></td></tr> <tr> <td>Item 7</td> <td><input type="text" id="p7" value="4748.8650" disabled="disabled"></td> <td><input type="text" id="q7" value="0" onchange="changeContent()"></td> <td><input type="text" id="t7" value="0" disabled="disabled"></td> </tr> <tr> <td>Item 8</td> <td><input type="text" id="p8" value="23087.9330" disabled="disabled"></td> <td><input type="text" id="q8" value="0" onchange="changeContent()"></td> <td><input type="text" id="t8" value="0" disabled="disabled"></td> </tr> </table> *note* the html table is actually made from a php loop pulling items from a database, but for the sake of simpler troubleshooting I made it a static table for posting here. Please help if you can. Thanks My code is all about darkening out part of the browser window, making unclickable. I detect if the user is running IE, and if so, I don't use window.innerHeight because MS doesn't support anything. However, I have noticed an issue, and I believe it has to do with the "top" value. I've tried using window.screenY, but that didn't seem to solve my problem. You see, if you are running FF, it draws a box that starts in the top corner and only goes down as far as you can actually see on your browser. Say you are scrolled down a little bit on the page, you can see the end of this box - it doesn't cover the entire page, only the part that is visible when the scrollbar is all the way up. I have included a picture to clarify what I'm talking about. The non-grayed out area is the area that would normally not be visible when the scrollbar is at the top. I would like to draw this box over the visible part of the page, no matter where you are scrolled. Right now, the box always draws from the very top of the page, even if that part isn't visible to the user. Code: function blur() { var blurDiv = document.createElement("div"); blurDiv.id = "blurDiv"; if(navigator.appName == "Microsoft Internet Explorer") blurDiv.style.cssText = "position:absolute; top:0; right:0; width:" + document.body.clientWidth + "px; height:" + document.body.clientHeight + "px; background-color: #000000; opacity:0.4; filter:alpha(opacity=40)"; else blurDiv.style.cssText = "position:absolute; top:0; right:0; width:" + window.innerWidth + "px; height:" + window.innerHeight + "px; background-color: #000000; opacity:0.4; filter:alpha(opacity=40)"; document.getElementsByTagName("body")[0].appendChild(blurDiv); } Hi There, The following piece of code is working fine in IE6 but not in IE 8: if (Windowvar != null) { Windowvar.close(); } Windowvar= window.open(sUrl, 'static', viewerWinOption, true); To explain the functionality: 1. User clicks on one of the links on page 1 2. Clicking takes user from Page 1 to Page 2 (the transaction page). 3. Along with page 2, another page (Page 3) is opened. 4. User saves the transactions in the Page 2 and he is taken back to page 1 5. User clicks other link in Page 1 and activity in point 2 is repeated along with point 3 The issue is, when User clicks on the link AGAIN(for second transaction) in the Page 1 the Page 3 opens in the same browser window in the IE 6 but in IE 8 it opens in the differenct browser window (which shouldnt be happening) Any help will be appreciated. Regards, Sameer. Hi there I've just completed a lovely slideshow script on my homepage. It works great in Firefox, but doesn't display at all in IE. It's on a live test page he http://www.modern-wedding-ideas.co.uk/index2.html I'm sure I'm just missing something really simple. Any help would be greatly appreciated. Also, this is a copy and paste job: I'm a newbie to javascript! So please be gentle. Many thanks Nicola I am pretty new to Javascript having a bit of a problem with a website with Google Maps integrated. URL is http://beta.5vanmap.com. JS is in /js/map.js. I have two checkboxes (ccCheck and caccCheck). The basis is when the box is ticked, it overlays a KML onto the map. This is working fine in Chrome, but in FF and IE it doesn't work, IE returns 'ccCheck is Undefined'. The code I am using is in the JS file, the bit it gets stuck at is as follows: Code: document.getElementById('ccCheck').onclick = function() { if (ccCheck == 1) { ccCheck = 0; ccOverlay.setMap(null); } else { ccCheck = 1; ccOverlay.setMap(map); } } If I stick a ccCheck = document.getElementById('ccCheck') within the onclick function (before the if statement), it places the overlay onto the map, but then when I untick the box it just stays there. It's such a simple thing (I think), and must be down to IE being pedantic about declaring the variable properly, the question is how should I be doing this? Thanks and regards Noel [CODE]<script type="text/javascript" language="Javascript"> <!-- Hide script from older browsers function toggleMenu(currMenu) { if (document.getElementById) { thisMenu = document.getElementById(currMenu).style if (thisMenu.display == "block") { thisMenu.display = "none" } else { thisMenu.display = "block" } return false } else { return true } } // End hiding script --> </script> [CODE] [CODE]<a href="javascript:void(0);" onclick="return toggleMenu('menu3')">Title</a>[CODE] It freezes in Internet Explorer; but works fine in Chrome. Solved
Hi all I'm having trouble with my XML news feed being displayed in IE. The JS calls the XML, and displays the relevent data on the homepage. This works beautifully in firefox, but fails completely in IE, what am I doing wrong? The Code for the script follows, and is contained within the <head> of the the HTML; Code: <script type="text/javascript"> var xmlDoc; <!-- if (window.XMLHttpRequest) { xhttp=new XMLHttpRequest(); } else // Internet Explorer 5/6 { xhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xhttp.open("GET","SDS.xml",false); xhttp.send(""); xmlDoc=xhttp.responseXML; var x=xmlDoc.getElementsByTagName("NEWS"); i=0; function display() { title=(x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue.fontsize("5").fontcolor("white").bold()); date=(x[i].getElementsByTagName("DATE")[0].childNodes[0].nodeValue.fontsize("2").fontcolor("white").bold()); stitle=(x[i].getElementsByTagName("STITLE")[0].childNodes[0].nodeValue.fontsize("3").fontcolor("white").italics()); story=(x[i].getElementsByTagName("STORY")[0].childNodes[0].nodeValue.fontsize("3").fontcolor("white")); pic=(x[i].getElementsByTagName("PIC")[0].childNodes[0].nodeValue); document.getElementById("picture2").innerHTML="<img src=" + pic + " />"; txt= title + "<br />" + date + "<br />" + stitle + "<br />" + story; document.getElementById("show").innerHTML=txt; } //--> </script> In FF, the XML is read, and the corresponding data is entered automatically into the HTML document. Everything works perfectly. In IE, nothing seems to happen, no text is displayed and the image is just the broken link icon. I assume I need to modify my ELSE statement somehow, but have no idea what to do! Unfortunately I cannot provide a link to the webpage, it has not been uploaded as it doesn't work yet. Would really appreciate being told where I've gone wrong so I can correct the code myself. Thanks, Dan I am trying to pass a screen resolution parameter to a java applet so that it will appear in full screen mode when it launches. This is working fine in Firefox and Chrome but not in IE8. Here is the code: 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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <script type="text/javascript"> function getresolution() { var yourres = screen.width + 'x' + screen.height; document.write('<param name="geometry" value="' + yourres + '">'); } </script> </head> <body> <applet name='rdp' code='com.elusiva.rdp.applet.RdpApplet' archive='JavaRDP16-1.1.jar' codebase='.' width='1' height='1'> <param name='server' value='XXXXXXXXXX'> <param name='port' value='3389'> <param name='shell' value='C:\seamlessrdp\seamlessrdpshell.exe -s C:\Program%20Files%20(x86)\TRAMS\CBplus\CBplus.exe'> <script type="text/javascript">getresolution();</script> </applet> </body> </html> Any help on this would be much appreciated! Hi, i have recently just built a simple website and have started to add some added editions one being the lightbox. i am using dreamweaver cs3 and on a mac laptop, so in safari it works brillaint no problems what so ever. but as soon as you load it in internet explorer the light box opens but it displays a 404 error on the first image of every gallery, on every different profile? if anyone would help that would be fantastic http://www.goodeveningladies.co.uk/profiles.co.uk Code: <a href="../images/lrgimages/adam/AdamLrg.jpg" title="Call us today on 07792530515!" rel="sexylightbox[Goodeveningladies.co.uk - Adam]"> <img src="../images/Adam.jpg" alt="" width="450" height="200" align="middle" /> <a href="../images/lrgimages/adam/1.jpg" title="Call us today on 07792530515!" rel="sexylightbox[Goodeveningladies.co.uk - Adam]"> <a href="../images/lrgimages/adam/2.jpg" title="Call us today on 07792530515!" rel="sexylightbox[Goodeveningladies.co.uk - Adam]"> <a href="../images/lrgimages/adam/3.jpg" title="Call us today on 07792530515!" rel="sexylightbox[Goodeveningladies.co.uk - Adam]"> <a href="../images/lrgimages/adam/4.jpg" title="Call us today on 07792530515!" rel="sexylightbox[Goodeveningladies.co.uk - Adam]"> <a href="../images/lrgimages/adam/5.jpg" title="Call us today on 07792530515!" rel="sexylightbox[Goodeveningladies.co.uk - Adam]"> <a href="../images/lrgimages/AdamLrg.jpg" title="Call us today on 07792530515!" rel="sexylightbox[Goodeveningladies.co.uk - Adam]"></a> here is a section of the coding that i use for each image obviously the names have changed and the directories have changed for each profile. any help would be much appreciated. Hey guys, so I'm trying to make a single function that will check to make sure the e-mails in both fields match AND to make sure the e-mail is in proper format. Strangely, with both if statements included the form will return no messages at all. If I comment out the if statement checking for proper format, the if statement to check for matching e-mail works just fine. I want this all to be in one function because I'm wanting it to be executed onSubmit with the form. Let me know what you guys think, any help is greatly appreciated: Code: <html> <head> <script type="text/javascript"> function verifyEmail() { var x = document.forms["emailForm"]["enterEmail"].value; var y = document.forms["emailForm"]["confirmation"].value; var atpos = x.indexOf("@"); var dotpos = x.lastIndexOf("."); if (x != y) { var msg = "The email addresses entered do not match, please enter matching email addresses"; document.getElementById("error").innerHTML = msg; return false; } if (atpos < 1 || dotpos < atpos + 2 || dotpos + 2 > = x.length) { var msg = "Improper e-mail format"; document.getElementById("error").innerHTML = msg; return false; } else { return; } } </script> </head> <body> <form name="emailForm" onsubmit="return verifyEmail();" method="post"> E-Mail Address: <input type="text" name="enterEmail"> Confirm E-Mail Address: <input type="text" name="confirmation"> <input type="submit" value="Submit"> <span id="error"></span> </form> </body> </html> Hi, I've made a web based tool that times how long a web page takes to load in an iframe and today I redesigned it but now it has issues. When I load it in Chrome and Opera the new version works fine but in FF 3.6 and IE 8 only the footer area is displayed. I have added the links below - You'll be able to access the code via your browser's "View page Source" option. URLs: New test (With problem): http://browserspeedtest.camerongray....net/version31/ Old test (Works perfectly): http://browserspeedtest.co.cc Any help is greatly appreciated! Cameron Gray Hello I am relatively new to java script. The code I have behaves differently when I debug it and when I just run is straight. There are three functions that one another in a particular sequence. When I debug it they get called in the correct sequence but otherwise they get called in a constant but random pattern. I know I am missing basic understanding of javascript Can some body help please. Thanks in advance Output when I open the page in a browser without debug. Code: Firebug's log limit has been reached. 0 entries not shown. Preferences readJSON2 There are no child objects inside parseJSON: There are no child objects GET http://10.208.137.92/js/v1/External/JSON/sample.json GET http://10.208.137.92/js/v1/External/JSON/sample.json 304 Not Modified 64ms jquery-1.6.2.js (line 7869) readJSON1 alerts [Object { alertPartnerDefinedInfos=[1], name="100 S.Ct. 1", more...}, Object { alertPartnerDefinedInfos=[1], name="100 S.Ct. 1", more...}, Object { alertPartnerDefinedInfos=[1], name="100 S.Ct. 1", more...}] Console Output when I debug Code: Firebug's log limit has been reached. 0 entries not shown. Preferences Firebug's log limit has been reached. 0 entries not shown. Preferences GET http://10.208.137.92/js/v1/External/JSON/sample.json GET http://10.208.137.92/js/v1/External/JSON/sample.json 304 Not Modified 111ms jquery-1.6.2.js (line 7869) readJSON1 alerts [Object { alertPartnerDefinedInfos=[1], name="100 S.Ct. 1", more...}, Object { alertPartnerDefinedInfos=[1], name="100 S.Ct. 1", more...}, Object { alertPartnerDefinedInfos=[1], name="100 S.Ct. 1", more...}] readJSON2 alerts [Object { alertPartnerDefinedInfos=[1], name="100 S.Ct. 1", more...}, Object { alertPartnerDefinedInfos=[1], name="100 S.Ct. 1", more...}, Object { alertPartnerDefinedInfos=[1], name="100 S.Ct. 1", more...}] inside parseJSON: alerts [Object { alertPartnerDefinedInfos=[1], name="100 S.Ct. 1", more...}, Object { alertPartnerDefinedInfos=[1], name="100 S.Ct. 1", more...}, Object { alertPartnerDefinedInfos=[1], name="100 S.Ct. 1", more...}] Javascript code Code: function populateSearchResults(alert){ var listOfAlertsDiv = document.getElementById('listOfAlertsDiv'); //var x = document.getElementById('rowTable').insertRow(0); //TODO: Replace the above code to remove Table declaration in above HTML. Instead use JQuery scrollbar and populate scroll area with the content below. // Create a new table. Add a row to it and then add the below cell to it. //TODO: Create a div // Create a table // Add the above created div to div1 var rowDiv = document.createElement('div'); rowDiv.className="scroll-content-item"; var rowContentTable = document.createElement('table'); rowContentTable.width="100%"; rowContentTable.border="0"; rowContentTable.cellpadding="0"; rowContentTable.cellspacing="0"; rowContentTable.summary="Row Content Table"; var rowContentTableFirstRow = rowContentTable.insertRow(0); var checkBoxCell = rowContentTableFirstRow.insertCell(0); checkBoxCell.width = "1%"; //x.valign = "top" //var checkBoxCell = x.insertCell(0); //checkBoxCell.width = "1%"; var checkBox = document.createElement('input'); checkBox.type = "checkbox"; checkBox.name = "checbox"; checkBox.value = "true"; checkBoxCell.appendChild(checkBox); var contentCell = rowContentTableFirstRow.insertCell(1); contentCell.width = "99%"; var contentTable = document.createElement('table'); contentTable.style.border = '1'; contentTable.cellPadding = '0'; contentTable.cellSpacing = '0'; contentTable.width = "100%" var titleRow = contentTable.insertRow(0); var titleCell = titleRow.insertCell(0); titleCell.width = "70%"; titleCell.id = "alertTile" var title = document.createElement('a'); title.href = "http://www.google.com"; title.id = "AlertResultNameLink"; titleText = document.createTextNode(alert.name); title.appendChild(titleText); titleCell.appendChild(title); var moveToFolderCell = titleRow.insertCell(1); moveToFolderCell.width = "5%"; moveToFolderCell.id = "moveToFolder"; var moveToFolderCellImage = document.createElement('img'); moveToFolderCellImage.alt = "Move To Folder"; //TODO: Change the hardcoding of the image location to symbolic links moveToFolderCellImage.src = "/js/v1/Alerts/images/co_documentFooterArrowFirst_inactive.png" moveToFolderCellImage.border = 0; moveToFolderCellImage.className = "moveToFolder"; moveToFolderCell.appendChild(moveToFolderCellImage); var editAlertCell = titleRow.insertCell(2); editAlertCell.width = "10%"; var editAlertButton = document.createElement('a'); editAlertButton.href = "http://www.google.com"; editAlertButton.className = "EditAlertButton"; var editAlertButtonImage = document.createElement('img'); editAlertButtonImage.alt = "Edit Alert"; //TODO: Change the hardcoding of the image location to symbolic links editAlertButtonImage.src = "/js/v1/Alerts/images/co_overlayBox_closebutton.png"; editAlertButtonImage.border = 0; editAlertButtonImage.className = "EditAlert"; editAlertButton.appendChild(editAlertButtonImage); var editAlertButtonText = document.createTextNode(' Edit Alert '); editAlertButton.appendChild(editAlertButtonText); //editAlertButton.innerHTML = " Edit Alert " editAlertCell.appendChild(editAlertButton); var alertMetaDataRow = contentTable.insertRow(1); var alertMetaDataCell = alertMetaDataRow.insertCell(0); var alertMetaDataTable = document.createElement('table'); alertMetaDataTable.width = "100%" var alertMetaDataTableRow = alertMetaDataTable.insertRow(0); alertMetaDataTableRow.width = "100%" var lastUpdateCell = alertMetaDataTableRow.insertCell(0); lastUpdateCell.width = "25%" //var lastUpdateCellText = document.createTextNode("Last Update:"); var lastUpdateCellText = document.createTextNode("Last Update: " +alert.lastRunDate); lastUpdateCell.appendChild(lastUpdateCellText); var nextUpdateCell = alertMetaDataTableRow.insertCell(1); nextUpdateCell.width = "25%" var nextUpdateCellText = document.createTextNode("Next Update:"); nextUpdateCell.appendChild(nextUpdateCellText); var clientIdCell = alertMetaDataTableRow.insertCell(2); clientIdCell.width = "50%" var clientIdCellText = document.createTextNode("Client ID: ") clientIdCell.appendChild(clientIdCellText); alertMetaDataCell.appendChild(alertMetaDataTable); var descriptionRow = contentTable.insertRow(2); var descriptionCell = descriptionRow.insertCell(0); var descriptionTitle = document.createTextNode("Description: "); descriptionCell.appendChild(descriptionTitle); var activeDeliveryRow = contentTable.insertRow(3); var activeDeliveryCell = activeDeliveryRow.insertCell(0); var activeDeliveryTitle = document.createTextNode("Active Delivery"); activeDeliveryCell.appendChild(activeDeliveryTitle); var rss1 = document.createElement('img'); rss1.style.border = "0"; rss1.src = "images/rssIcon.png"; rss1.hspace = "4"; activeDeliveryCell.appendChild(rss1); var rss2 = document.createElement('img'); rss2.style.border = "0"; rss2.src = "images/rssIcon.png"; rss2.hspace = "4"; activeDeliveryCell.appendChild(rss2); var rss3 = document.createElement('img'); rss3.style.border = "0"; rss3.src = "images/rssIcon.png"; rss3.hspace = "4"; activeDeliveryCell.appendChild(rss3); var rss4 = document.createElement('img'); rss4.style.border = "0"; rss4.src = "images/rssIcon.png"; rss4.hspace = "4"; activeDeliveryCell.appendChild(rss4); contentCell.appendChild(contentTable); rowDiv.appendChild(rowContentTable); listOfAlertsDiv.appendChild(rowDiv); contentCell.appendChild(document.createElement('br')); contentCell.appendChild(document.createElement('hr')); contentCell.appendChild(document.createElement('br')); } function readJSON(){ var json = ""; //$(document).ready(function(){ $.getJSON("/js/v1/External/JSON/sample.json", function(data){ json = data; console.log("readJSON1"); console.dir(data); }); //}); console.log("readJSON2"); console.dir(json); return json; } function parseJSON(){ var alerts = []; var json = readJSON(); console.log("inside parseJSON:"); console.dir(json); //TODO: Check if JSON is not null. for(var i in json.alerts){ var createdDate = new Date(json.alerts[i].createdDate); var alert = new Cobalt.Alerts.DataTypes.Alert(); var AlertPartnerDefinedInfos = []; alert.name = json.alerts[i].name; alert.lastRunDate = $.format.date(new Date(json.alerts[i].lastRunDate),"MM/dd/yyyy hh:mma"); alerts.push(alert); } //console.log("fillRows: " +alerts.length); return alerts; } $(document).ready(fillRows=function(){ var alerts = parseJSON(); //console.log("fillRows: " +alerts.length); for(i=0;i<alerts.length;i++){ var alert = alerts[i]; populateSearchResults(alert); } }); Hi everybody I have a problem I want a header that is a slideshow and use lightbox for other images. No I have this all working but not at the same time. If I use this code in this order only the first script that is the lightbox script works. PHP Code: <script type="text/javascript" src="js/jquery.min.js"></script> <script type="text/javascript" src="js/pirobox.js"></script> <script type="text/javascript"> $(document).ready(function(){ $().piroBox({ my_speed: 300, //animation speed bg_alpha: 0.5, //background opacity slideShow : 'true', // true == slideshow on, false == slideshow off slideSpeed : 3, //slideshow close_all : '.piro_close' // add class .piro_overlay(with comma)if you want overlay click close piroBox }); }); </script> <script src="http://code.jquery.com/jquery-latest.js"></script> <script src="js/jquery.cycle.all.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $('.slideshow').cycle({ fx: 'scrollLeft', speed: 1000, timeout: 7000 }); }); </script> If I use this code so I switched the order only the slideshow works: PHP Code: <script src="http://code.jquery.com/jquery-latest.js"></script> <script src="js/jquery.cycle.all.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $('.slideshow').cycle({ fx: 'scrollLeft', speed: 1000, timeout: 7000 }); }); </script> <script type="text/javascript" src="js/jquery.min.js"></script> <script type="text/javascript" src="js/pirobox.js"></script> <script type="text/javascript"> $(document).ready(function(){ $().piroBox({ my_speed: 300, //animation speed bg_alpha: 0.5, //background opacity slideShow : 'true', // true == slideshow on, false == slideshow off slideSpeed : 3, //slideshow close_all : '.piro_close' // add class .piro_overlay(with comma)if you want overlay click close piroBox }); }); </script> I also tried this: but then they both did not work PHP Code: <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script> <script type="text/javascript" src="js/jquery.cycle.all.min.js"></script> <script type="text/javascript" src="js/jquery.min.js"></script> <script type="text/javascript" src="js/pirobox.js"></script> <script type="text/javascript"> $(document).ready(function(){ $('.slideshow').cycle({ fx: 'scrollLeft', speed: 1000, timeout: 7000 }); $().piroBox({ my_speed: 300, //animation speed bg_alpha: 0.5, //background opacity slideShow : 'true', // true == slideshow on, false == slideshow off slideSpeed : 3, //slideshow close_all : '.piro_close' // add class .piro_overlay(with comma)if you want overlay click close piroBox }); }); </script> Can you help me solve this problem so they both work? I have merged two scripts to make a popup that comes up even if blocked, and is for first time visitor only (cookie). The problem is that the way I'm doing it, it might show one or more times to the visitor. I don't want that because it will be irritating and this is a high-priority client. I'm posting the whole script because I think the problem is calling the popup before checking the cookie, but not sure how to rearrange things. Also, I did search and found some good dhtml stuff but don't want to rewrite. This was supposed to be done last night so if I can fine tune this for now, I'll have time to rewrite something better (or at least play around with another script). Also, the popup refuses to come up in IE - I have IE6, but I detest IE and their site doesn't even load in it so whatever. I tested in FFox3, Opera 10 and Safari and it seems to work but like I say because of the onclick - it will load at any click until the user goes to a different page. I added a refresh in there but it just made things worse - too much going on for the user at that point. Thanks for any suggestions. I hope I've used the right tags for this. I've highlighted the stuff at the bottom that I think is where I need the most help. Here is the code: // added for popup -kk var expDays = 100; // number of days the cookie should last //var page = "only-popup-once.html"; //var windowprops = "width=300,height=200,location=no,toolbar=no,menubar=no,scrollbars=no,resizable=yes"; var newwin = null; function openwin() { // window.location.reload(); var url = "/NEWSLETTER.html" try { if (newwin != null && typeof(newwin.location.href) != 'undefined') { newwin.location.href = url; } else { newwin = open(url, "Subscribe", "height=390,width=545,screenX=0,left=0,screenY=0,top=0,channelmode=0,dependent=0,directories=0,fulls creen=0,location=0,menubar=0,resizable=yes,scrollbars=0,status=0,toolbar=0"); } newwin.focus(); } catch (e) { newwin = open(url, "Subscribe", "height=390,width=520,screenX=0,left=0,screenY=0,top=0,channelmode=0,dependent=0,directories=0,fulls creen=0,location=0,menubar=0,resizable=yes,scrollbars=0,status=0,toolbar=0"); newwin.focus() } } function GetCookie (name) { var arg = name + "="; var alen = arg.length; var clen = document.cookie.length; var i = 0; while (i < clen) { var j = i + alen; if (document.cookie.substring(i, j) == arg) return getCookieVal (j); i = document.cookie.indexOf(" ", i) + 1; if (i == 0) break; } return null; } function SetCookie (name, value) { var argv = SetCookie.arguments; var argc = SetCookie.arguments.length; var expires = (argc > 2) ? argv[2] : null; var path = (argc > 3) ? argv[3] : null; var domain = (argc > 4) ? argv[4] : null; var secure = (argc > 5) ? argv[5] : false; document.cookie = name + "=" + escape (value) + ((expires == null) ? "" : ("; expires=" + expires.toGMTString())) + ((path == null) ? "" : ("; path=" + path)) + ((domain == null) ? "" : ("; domain=" + domain)) + ((secure == true) ? "; secure" : ""); } function DeleteCookie (name) { var exp = new Date(); exp.setTime (exp.getTime() - 1); var cval = GetCookie (name); document.cookie = name + "=" + cval + "; expires=" + exp.toGMTString(); } var exp = new Date(); exp.setTime(exp.getTime() + (expDays*24*60*60*1000)); function amt(){ var count = GetCookie('count') if(count == null) { SetCookie('count','1') return 1 } else { var newcount = parseInt(count) + 1; DeleteCookie('count') SetCookie('count',newcount,exp) return count } } function getCookieVal(offset) { var endstr = document.cookie.indexOf (";", offset); if (endstr == -1) endstr = document.cookie.length; return unescape(document.cookie.substring(offset, endstr)); } function checkCount() { var count = GetCookie('count'); if (count == null) { count=1; SetCookie('count', count, exp); // window.open(page, "", windowprops); window.onclick = openwin; // window.location.reload(); } else { count++; SetCookie('count', count, exp); } } window.onload=checkCount; // end popup -kk hereis the html file and javascripton click of this button a html ***************************** <table class=matcolor id=topnav cellspacing=0 cellpadding=0 width=550 border=0 bgcolor="#FFCCCC"> <tbody> <tr align=middle> <td id=menu1 onMouseOver="this.className='mPrimaryOn';showmenu(this);" onClick="this.document.location.href=''" onMouseOut="this.className='mPrimaryOff';hidemenu(this);" class="mat" height="20"> <div align="center"><font color="#FF0000">Desk Top Publishing </font></div> </td> <td width=1 bgcolor=#ff9900 class="mat"></td> <td id=menu2 onMouseOver="this.className='mPrimaryOn';showmenu(this);" onClick="this.document.location.href=''" onMouseOut="this.className='mPrimaryOff';hidemenu(this);" class="mat" height="20"> <div align="center"><font color="#FF0000">Transcription</font></div> </td> <td width=1 bgcolor=#ff9900 class="mat"></td> <td id=menu3 onMouseOver="this.className='mPrimaryOn';showmenu(this);" onClick="this.document.location.href=''" onMouseOut="this.className='mPrimaryOff';hidemenu(this);" class="mat" height="20"> <div align="center"><font color="#FF0000">Accounts Processing </font></div> </td> </tr> </tbody> </table> ***************************************** <script language=JavaScript> ix = document.getElementById('tblmenu1').getBoundingClientRect(); new ypSlideOutMenu("menu1", "right",ix.left + ix.right ,ix.bottom + 10); </script> **any thing i have to alter to work in firefox please help |