|
JavaScript - Browser Differences?
Hi, I wrote some javascript for a slideshow. The main webpage contains:
Code: <FORM NAME="myform"> <IMG SRC="firstimage.jpg" NAME="mypic"><br> <INPUT TYPE="text" SIZE="180" NAME="mycaption" VALUE="First Caption"> <INPUT TYPE="button" VALUE="Prev" NAME="prevbutton" DISABLED=true ONCLICK="slideshowBack()"> <INPUT TYPE="button" VALUE="Next" NAME="nextbutton" ONCLICK="slideshowUp()"> </FORM> which assigns the image and caption for the first picture, and sets the Prev and Next buttons to disabled and not disabled respectively. So you start with the first image and caption, and an enabled "Next" button. I have global javascript variables: num (init to 1), max (init to 7), img1..7 (new Image ()), img1..7.src (filenames for the images), text1..7 (captions for the images), map1..7 (maps for the images). The function for moving to the next slide is: Code: function slideshowUp()
{
num=num+1
if (num==max+1)
{num=1}
document.mypic.src=eval("img"+num+".src")
document.getElementById("mypic").useMap=eval("map"+num)
document.myform.mycaption.value=eval("text"+num)
document.getElementById("prevbutton").disabled=(num==1)
document.getElementById("nextbutton").disabled=(num==max)
}
I developed this in HMTLPad (10.2) and it works perfectly in that program's preview mode. But it won't work in the main browsers! In IE 9 (9.0.33), when you click the Next button, nothing at all happens. Image and caption stay the same, Next stays enabled, Prev stays disabled. Maps don't work. Chrome (38.0.2125.122 m) and Firefox (27.0) behave like each other. The images change, but not the captions or the Prev/Next buttons. Maps don't work. Is this to be expected? If so, how do I work around it? Similar TutorialsI'm sure this is old news, but I am trying to use the CSS Horizonal List Menu script on JavascriptKit and having some display problems. http://www.javascriptkit.com/script/...stopmenu.shtml It works well except that I can't seem to get the CSS settings to display the same way in FF and IE. I can use pixel settings for the box size to get the menu across the entire screen in FF, but it only goes about 80% of the way in IE. If I maximize for IE, then the FF menu wraps. The % options for box size don't seem to work either. I am using Dreamweaver 4 for css settings. Is this just a limitation in the way the two browsers interpret the code? If there is an easy fix I could try it, otherwise I can live with what I have. I just need to know if there is some way to deal with it or not. If interested, the current version is at: www.chromafrica.com/template/template2.html. What are the differences between these? 1. Code: document.domain 2. Code: window.location.hostname 3. Code: self.document.location.hostname #1 and #2 I would think are very cloes, #3 would be if someone framed the site the script was on, it would show the framed site, and not the site that is framing? because of self. Hi all, This is my first post of many and am new to JS. I'm familiar with Java so I shouldn't be too lost. What I'm about to do is add support for a web app from Firefox to IE that uses OpenLayers. I've searched and found a link to this site from another thread which had a list of supported functions and what not he http://www.quirksmode.org/dom/w3c_core.html From what I've read in the last hour it seems as though I will have to use some browser sniffing (isMozilla, isIE8, etc) and have multiple conditions (if-else's) in my functions to use the proper calls. Does anyone have extra material that contains differences between IE and firefox? Someone mentioned to me that in lists IE doesn't support trailing commas but ff does.. Things like this would be very helpful Thanks, Chris Can someone explain to me the differences between the following code snippets? Mainly i don't understand the purpose of using prototype and not sure if there is a functional difference between the syntax of declaring functions. Code: var myObj = function () {
this._myInt = 1;
}
myObj.prototype = {
myNewFunction: function() {
this._myInt = 2;
}
}
VERSUS Code: var myObj = function () {
this._myInt = 1;
function myNewFunction(){
this._myInt = 2;
}
}
I'm trying to find the difference between 2 times. Time formats are 00:00:00.0 For example... var t1 = "00:07:51.0"; var t2 = "00:53:21.0"; How do I calculate the difference between those 2 times? TIA. Greeting Everyone, Can anyone breakdown the differences between programming languages in VERY VERY BASIC plain English? (i.e. HTML use for website format, CSS used for the graphics on the webpage) Here's what I have questions about: 1. Differences between the most commonly used programming languages for software/web development (Javascript, Ruby on Rails, Phyton, etc.). 2. How do you determine which programming languages to use? 3. What factors are considered? Thank in advance for the people that reply. =) Hello, As a novice, I'm not sure which one to use though. I'm trying to do a calculation with numbers in JavaScript using variables, particularly adding variables. Any guided understanding of this concept is welcome. For example: Code: n = parseint(n) document.write(n += m) A week or so ago Old Pedant and I discussed methods of converting string inputs to numbers. I speculated that *1 might be quicker. I have now run a test:- Code: <script type = "text/javascript">
var start = new Date().getTime();
for (var i =0; i <100000; i++) {
var a = "2";
a = a *1;
}
var end = new Date().getTime();
var diff1 = end - start;
alert (diff1); // 109
var start = new Date().getTime();
for (var i =0; i <100000; i++) {
var a = "2";
a = parseInt(a);
}
var end = new Date().getTime();
var diff2 = end - start;
alert (diff2); // 140
var start = new Date().getTime();
for (var i =0; i <100000; i++) {
var a = "2";
a =Number(a);
}
var end = new Date().getTime();
var diff3 = end - start;
alert (diff3); // 140
var start = new Date().getTime();
for (var i =0; i <100000; i++) {
var a = "2";
a = +a;
}
var end = new Date().getTime();
var diff4 = end - start;
alert (diff4); // 109
</script>
The results vary slightly with each run, but the conclusion is that there is no real difference between the methods - except for a = a*1 and a = +a which consistently comes in lower than parseInt() or Number(). But the differences are too small to be significant. The following code results in the exact same output. Is there an advantage to using i++ over ++i (or visa-versa) in the loop? Code: <script type="text/javascript">
var tarr1 = []; for (var i=0; i<10; i++) { tarr1.push(i); }
var tarr2 = []; for (var i=0; i<10; ++i) { tarr2.push(i); }
alert(tarr1.join(',')+'\n'+tarr2.join(','));
</script>
Similar question for the increment method in the following: Code: <script type="text/javascript">
var tarr1 = []; var i=0; do { tarr1.push(i); i++; } while (i<10);
var tarr2 = []; var j=0; do { tarr2.push(j); ++j; } while (j<10);
alert(tarr1.join(',')+'\n'+tarr2.join(','));
</script>
Greetings, I am currently using the websites tutorial about browser detection using the navigator. http://www.javascriptkit.com/javatutors/navigator.shtml I am however finding myself unable to detect a pattern in order to learn from. My aim is to use Browser detection to have a CSS file for each browser type, such as Firefox, IE, Opera, Safari and then an overall CSS file if none of the above, to fix numerous flaws. For IE and Firefox using the site's code is all well and good and while I haven't tested it yet I'm wondering how to set up the coding so that it can detect a safari browser. There are lots of slashes and d's and brackets and I do find myself unable to understand their purpose. So if someone can explain how I could do it for Safari I would be very appreciative. I need a script that will redirect to a specific page is the browser is safari version 4. if the browser is NOT safari 4 I want the browser to stay on the current page.
Hello, I have a question what is the best way to identify a browser, browser version and OS in javascript. I have try a few scripts but they all fail. This will help me out formating the code for diferent browsers. Thanks Hey, new guy here, not sure if this should be under XML, but this was my best guess. Am working with javascript, need to pull the text content from a bunch of places on the page, then I build xml with them, and now i want to have a button that will take user to a page in the browser where all they see is the raw xml tree. Help? I am attempting to make an page on my website where visitors can set my website as their homepage. I am trying to make my website read which browser my visitors are using and then redirects them to the page for the right browser where I can tell them how they can set my website as their homepage. Basically I need exactly the same thing as THIS. Could you explain to me in plain English how I can realize this. This is what I know have: Code: <table width="759" border="0" align="center" cellpadding="0" cellspacing="0" >
<tr align="center">
<td width="378" height="28" align="right">Selecteer jouw browser </td>
<td width="16"></td>
<td width="365" align="left"><form id="browserSelection" name="browserSelection" action="customizeBrowser" method="GET"><select name="browser" size="1" id="browser" onchange="document.browserSelection.submit();"><option value="ff" selected>Firefox</option><option value="ie">Internet Explorer</option><option value="chrome">Chrome</option><option value="opera">Opera</option><option value="safari">Safari</option></select></form></td>
</tr>
</table>
________________________________________ Please tell me if I make any English mistakes in my posts. I am trying to write as perfectly possible. hey all is there a code where I can detect if the browser is IE6 or IE7 and send them to another webpage? my current design is not compatible with IE6 or 7 and i want to make a new page that's compatible. thanks! Hi, On www.pizzalita.com, I added a div layer that would ask people for an email address and if you don't like to, you camn click the cross to close that layer. This works just fine in Google Chrome but I today realized that it doesn't work for other browsers, not in IE nor in Firefox. Does anyone have any hints, suggestions and tips how to resolve this to get it working properly in all browsers? Firefox says it can't find the function closediv() - but why not, it is there, I can look at the source and I see it.... any clues would be awesome! Thank you very much, help is appreciated! Ron I have code that I've been using for awhile now that will automatically log users off my site after a period of time. It works great using a 32 bit browser but not at all with a 64 bit browser. For the life of me I can't figure this out. <script type='text/javascript'> var secondsRemaining = 30; var mhcTimer; function countDown() { secondsRemaining -= 1; if (secondsRemaining <= 0) { secondsRemaining = 0; window.location='login.aspx'; } } function startAutoLogoff() { if (mhcTimer) { return false; } else { mhcTimer = setInterval('countDown();', 1000); } } startAutoLogoff(); </script> Hello, I couldn't find another thread that had this problem but it seems like it would be fairly simple. I am also just now starting to learn JavaScript. But when I enter this code into Notepad++ Code: <HTML>
<HEAD>
</HEAD>
<BODY>
<SCRIPT type = "text/javascript">
document.write("Hello World");
</SCRIPT>
</BODY>
</HTML>
Instead of printing out "Hello World" as it should, it simply shows me the code I wrote line for line. I have tried opening in both Chrome and IE and since all other webpages work fine I assume that both browsers have javascript enabled. Thanks in advance Hi, i wanted to know whats wrong with this coding as its making the browser crash, firefox 5 $(document).ready(function() { /* open rel=external in new window */ $('a[rel=external]').attr('target', '_blank'); /*Scrolling background clouds */ var offset = 600; var offseta = 1450; function scrollbackground() { // decrease the offset by 1, or if its less than 1 increase it by // the background height minus 1 offset = offset + 1; offseta = offseta + 1; // apply the background position if((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i)) || (navigator.userAgent.match(/iPad/i))) { $('#cloud2').css("background-position", offseta + "px top"); } else { $('#cloud').css("background-position", offset + "px top"); $('#cloud2').css("background-position", offseta + "px top"); } // call self to continue animation setTimeout(function() { scrollbackground(); }, 100 ); } // Start the animation scrollbackground(); }); //end Hi Guys Is it possible to combine the following to bits of code. The first code will send the user to the browser home page if using IE. Code:[[a href="about:home">home</a>]] The second code will send the user to the browser home page if using Firfox. Code:[[input type="button" onclick="if (window.home) window.home()" value="Home">]] Both codes work in their respective browsers, but can they be combind. As the man from Tesco's says "Every little helps". Regards, Dingbat |
|||||||