I have been working with HTML for a few years and am now just getting comfortable with CSS, but I never got into JavaScript. I learn best by reading and following instructions and doing small projects that emphasize the concepts. Can anyone recommend a good book for a beginner at Javascript? Something that makes you practice?
I was just wondering if anyone knows of a great javascript book to buy. I am looking for something super duper hard core. I would love it to have documentation galore that includes all of the AJAX and DOM and XML. You know... like a javascript BIBLE. Something thick and comforting. Something that makes you feel all warm and toasty inside just knowing that it is there. So if I start running into some problem I can just glance at the book and rest assured that if the problem exculates not to fear. I have .... THE BOOK.
Anyone trying out the javascript drop down menus from the Sitepoint Javascript Anthology book might have noticed that in IE7 the sub menus are misaligned, they are offset to far to the right.
Has anyone else come across this problem and does anyone know how to fix it? It has unfortunately broken several of my menus, though if you just try the demo menus from the book in IE7 they also suffer the same problem.
Was there a sitepoint blog post or article that covered the methods used to implement the sitepoint.com home page book frame? (frame at btm of page with book promo)
I want to learn Javascript the right way, I'm not sure id I should buy the book or buy the online video for kevin? who tried both give me a recommendation.
I have still yet to see a JavaScript Editor that comes close toreading a good JS book, learing it and using it with a text editor.
Anyway, here my recipe for build successfull DHTML Applications:
If you want to support only M$ IE stop here and do the following: 1) Install blindfold 2) Repeat the phrase - I love my cage :p
Buy the Book: Buy O'Reilly's JavaScript The Definitive Guide ~ The best damn JS guide & reference period, end of story, finito
Get a good Text Editor with Syntax Highlighting support ~ Real programmers don't use WYSIWYG tools ~ You will never learn with these tools ~ Code is always inefficient ~ Apps to Use: ~ OSX - BBEdit - Powerful but no MDI support :( ~ Win32 - UltraEdit - Low cost, high power, competent yntax Highlighting ~ ^nix - Kate or KDevelop - Well written but needs KDE (big) ~ Does not work with OSX's X11 Client :[ - ('+' key doesn't work)
Browser Development Platform ~ Mozilla (1.3+) (FireFox release suggested) ~ Why Moz? ~ Mozilla based development works in: ~ IE 95% of the time ~ Konquorer (KDE/Apple...), Opera 99%+ of the time ~ Why not IE? ~ IE based development works in standards based browsers only 50% of the time ~ IE black hole methods (non standards based) causes people to ignore standards based DHTML objects, properties and methods. ~ Browser Support Baseline ~ IE 5.5sp2+ ~ This is the first (reasonably) stable version of IE for advanced JS coding. ~ When ever I experience weird bugs from users I have them them upgrade to IE5.5sp2+ and it goes away. ~ Netscape 6.n+ ~ Netscape 4.7 should not be supported! ~ Opera ? (I plead ignorance here) ~ Konquorer/Safari ? (I plead ignorance here)
Debugging Methodology: ~ Use JS Console (Moz) ~ Put try/catches at all error prone functions / methods ~ Because of IE's error stupidity, you should get as close to the source as possible. ~ Read stack property of error in Mozilla to read stack of error (powerful) ~ Install JavaScript Console Status in Mozilla ~ Use window.onerror handler ~ In IE, read arguments.callee.caller... to read stack ~ Goes only to last error throw point ! not error source point :[ ~ Note: at this time, there is no way to to get to the Error object in Mozilla from this handler. Therefore no stack in Moz. Use Try/Catch instead
Add the following code to every page: _w=window function getElem(s){return document.getElementById(s)} function getEvent(e){ return is.ie?_w.event:e }
Event Declaration ~ Avoid using inline javascript declarations (In HTML Tags) ~ Inline declarations is where you call a function or run code from the html elements definition (onclick="<RunSomeCode>") ~ This technique will not allow you to access the event argument in Mozilla... ~ Instead use getElem("<Element ID>").onclick=<function name> ~ Declare handlers like: function mySlickFunction(e){e=getEvent(e)... ~ This will ensure you always have Event Object ~ If you want to get fancy you could normalize the Event at getEvent() ~ Method Declaration ~ Declare <obj>.<meth>=function <obj_acro>_<event>(args){ ~ Example: myObj.smile=function MO_smile(args){... ~ Why? - When you build you're stack in the debug you get the method names!
Other Stuff: ~ Use JSON (www.json.org) as much as possible to nest data structures (for more complex programming). ~ JSON is fast (primitively supported), stable easy to read.
Could anybody else add to this list?
If people are interested, I can make a document and add other stuff like JS debugging libraries, Consoles and other slick JS Debugging stuff.
I have a login link that is supposed to open a modal and then direct the visitor to a submission form once they are logged in. Here's the link code: <a href="/resources/submit" class="login">Submit New</a> and the jquery based on an example in the ninja book:
When I put a path name in the href, the modal opens but then quickly closes itself and sends the visitor to the form. If I use href="#" the modal opens and stays open, but when the visitor submits the form they are returned to the page they were on rather than the submission form.
I keep setting this aside and coming back to it, thinking I'll understand what's gone wrong here, but I still don't. I'd like this modal to work for other links with different paths, so I don't want to code the redirect into the js - I want to be able to control it in the link itself.
My client currently has a Flash book reader on his site that provides a UI for reading a book.Each page of the book is a GIF, and there are hundreds of books available.Now, my client would like to change this reader, and I've convinced him to let me rebuild the reader in jQuery.The hiccup is that, for copyright reasons, the images of the pages in the book must not be downloadable or accessible in the source code.(In other words, there shouldn't be a way to steal the book other than taking a screenshot of every page.)I want the reader to be powered by jQuery, it is, by definition, in-browser.
I am a teacher and would love to find a way to create a form that my students/parents fill out and email me and then have a macro/script take this information and automatically create/update a contact in my Outlook Express Address Book.
Please let me know if there is a way to accomplish this. My site is on Comcast, and I cannot dynamically save information to the site.
This is really only for anyone who has the book and has mastered the concepts of the rollover drop down menus from Chapter 7 in Stuart Langridge's DHTML Utopia book.
Does anyone know what the key is to getting the first menu list to appear inline, rather than as a block, while leaving everything else working as it does already?
I remember a while back there was an article published on here explaining how to make the pop up footer that appears on the site with an advert for a book in it.
I'm learning jquery from book Novice to Ninja and the Animated Navigation (site 64) is not working with jquery-1.5.1.min.js (it's workin fine with the old one - jquery-1.4.min.js but since there is new jquery avaliable i really don't want to use the old one).Here is the code...
Code JavaScript: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
i want to add the link address when clicked on the link in web page to the outlook express address book when the outlook window populates. i tried to put
<a href="mailto:enquiry@mydomain.com" > click here </a>
but it only add address to the To section of outlook window, i want it should store the address in the address book.. of outlook express..
I'm working on some code and am running into brick walls. I'm trying to write out Javascript with Javascript and I've read the clj Meta FAQ and didn't see the answer, read many similar posts (with no luck though), and searched through the IRT.ORG Faqs (www.irt.org/script/script.htm).
The Javascript is designed to open an popup window and then inside that window call another script which will resize that window. There may be another way around this but the reason I tried this approach initially was that I wanted to call the onload handler in the popup window to resize the image only after the image had completely loaded. I've had some code in the primary Javascript file (showimage.js) before that works if the image has been cached but on the first load, it doesn't resize properly which tells me it is probably because it is trying to resize the window based on the image size but it isn't completely known at that point. So I removed that code and tried placing the resizing code in the second Javascript file (resizewindow.js). BTW I've tried other code to open a popup image and automatically size it ie Q1443 at irt.org but that doesn't do exactly what we need.
Even if there is another way to do this with one file, I still want to figure out why this isn't working in case I run into it in the future.
I thought what I would need to do to use document.writeln to write Javascript would be to escape any special characters and to break apart the script tag ie
document.writeln('</SCRIPT>');
would become
document.writeln('</SCR' + 'IPT>');
I have a HTML page and 2 Javascript files. All files are in the same directory and have permissions set correctly.
Here are the 3 files (keep in mind wordwrap has jacked up the formatting):
index.html ---------- <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Test</title> <SCRIPT type="text/javascript" LANGUAGE="JavaScript1.1" SRC="showimage.js"> </SCRIPT> </head>
<body> Click the house<BR> <A ONCLICK="newWindow1('house1.jpg','Nice House')"><IMG SRC="house1thumb.jpg"></A> </body> </html>
showimage.js ------------ function newWindow1(pic,sitename) {
resizewindow.js --------------- function resizewindow() { // Do resizing here. // Right now this isn't being executed alert("resizing window"); }
Can anyone provide some pointers as to why this javascript is failing? I'm using IE6 on Win2k and when I click on the image to open the popup window, it does open the window but it is white with no content and the system immediately goes from about 4% CPU usage to 100% and consistently stays there until I kill that window with the task manager.
Attached is a simple HTML file that adds and delete rows. In the add row function I set an attribute "onClick" this triggers the testMessage() function. When I try this in Firefox it works just fine however on IE it just refuses to work.
What is interseting is the ROW that already exists has a similar 'onClick' event which works when the page is loaded, but subsequent "row" additions to the table to not work in IE. Code:
I'm getting errors in Firefox everytime I try to run this frame resize code, but it works fine in IE. I can't seem to figure out what the problem is with it.
The error is: Error: theFrame has no properties Line: 8
The line that the javascript console is showing an error for is in italics.