Tag Archives: JavaScript

Is object in viewport?

I can’t remember if I posted this before, so I am posting again. This fun little script checks to see if a particular object is in the viewport. http://codepen.io/TroyThib/pen/PPOzyv

Posted in JavsScript, jQuery | Tagged , , | Comments Off on Is object in viewport?

Change URL hash with JavaScript using location.hash

This fun little function will change the hash (#) in the URL. In this example, I have an input element and it’s contents will populate the hash. On the “keyup” event the “location.hash” function creates or changes the hash to … Continue reading

Posted in JavsScript, jQuery | Tagged , , , , | Comments Off on Change URL hash with JavaScript using location.hash

Javascript Query Strings – get URL variables

Nice sweet and clean function for grabbing URL variable from CSS-Tricks.com. Get URL Variables

Posted in JavsScript | Tagged , , , | Comments Off on Javascript Query Strings – get URL variables

Create a JavaScript array and loop through it

Create a JavaScript array and loop through it: var theBeatles = [ “John Lennon”, “Paul McCartney”, “George Harrison”, “Ringo Starr” ]; for (i = 0; i < theBeatles.length; i++) { $(‘#myDiv’).append(theBeatles[i]+’ ‘); }

Posted in JavsScript, jQuery | Tagged , , , , | Comments Off on Create a JavaScript array and loop through it

7 Essential JavaScript Functions

More mad knowledge from David Walsh. http://davidwalsh.name/essential-javascript-functions

Posted in JavsScript | Tagged , , , , , , , | Comments Off on 7 Essential JavaScript Functions

Event Propagation

Event PropagationThis is when a triggered event not only fires the intened event, but also fires events for parent and child DOM nodes (event bubbling and event capturing). Event BubblingThis happens when an event bubbles up to the parent nodes. … Continue reading

Posted in JavsScript, jQuery | Tagged , , , , , , | Comments Off on Event Propagation

Simple jQuery Parallax effect

This simple example will scroll the images inside the “box” DIV at a slower rate than the container. $(document).ready(function() { $(“#box”).scroll(function() { s = $(“#box”).scrollTop(); $(“#box img”).css(“-webkit-transform”,”translateY(” + (s/3) + “px)”); $(“#box img”).css(“-moz-transform”,”translateY(” + (s/3) + “px)”); $(“#box img”).css(“-ms-transform”,”translateY(” + … Continue reading

Posted in CSS3, JavsScript, jQuery | Tagged , , , | Leave a comment

JavaScript replace – Chrome not liking JS replace without using a RegEx.

I was trying to removed a parentheses character from a string. Was that why? Also, you must must rap ) in []. does not work in Chrome galleryDiv_bg = galleryDiv_bg.replace(‘)’,”); does work in chrome galleryDiv_bg = galleryDiv_bg.replace(/[)]/g,”);

Posted in JavsScript | Tagged , , , | Leave a comment

onmouseover not working in IE9

I had an image inside a DIV that had a rollover applied to it in an external JS doc. It worked in everything but IE9. IE7-8, FF, Chrome, all worked. I tried applying some inline JS using onMouseover and it … Continue reading

Posted in JavsScript | Tagged , , , | Leave a comment

Javascript – creating element

Adding elements to the DOM Create new element var NewImg = document.createElement(“img”); // creates an image element Add attributes to an element NewImg.setAttribute(‘src’, ‘https://www.google.com/images/srpr/logo3w.png’); Add new element to the page document.getElementById(“container”).appendChild(NewImg);   To set the ‘class’ attribute, you must do … Continue reading

Posted in JavsScript | Tagged , , | Leave a comment

setAttribute(“class”……) does not work in IE9

This does not work in IE9: var button_div_container = document.createElement(‘div’); button_div_container.setAttribute(‘class’, ‘button’); You must do it this way: var button_div_container = document.createElement(‘div’); button_div_container.className = ‘button’; WTF?

Posted in JavsScript | Tagged , , , | Leave a comment

Change CSS with JavaScript

This is a simple script that will change the CSS of any object. You send the function the ID, the CSS attribute you want to change, and the value.. I actually struggled a bit with this as using dot syntax … Continue reading

Posted in JavsScript | Tagged , | Leave a comment

Alternative to inline JavaScript events

window.onload = function() { document.getElementById(‘div1′).onclick=readPage; } function readPage() { alert(‘test’); } As opposed to putting an “onclick” JS script call inline, here is a way (outside of jQuery) to do just that. When you click on the “div1” object it … Continue reading

Posted in JavsScript | Tagged | Leave a comment

focus() in Firefox

You have to set a little delay in the focusing of the field. setTimeout(function(){field.focus()}, 10); I found this from at http://www.codingforums.com from a user post.

Posted in JavsScript | Tagged , , | Leave a comment