jquery
Only Include jQuery if it Hasn’t Already Been Included
If jQuery gets included twice, things break. Because of various nested documents with server-side scripts, I encountered a few situations were jQuery would occassionally be included twice. To check, and make sure to only include it once, you can use the following:
Read MoreA Super Simple jQuery Fading Slideshow
I usually end up doing a search about every month for a nice slideshow script that fades between the various slides, provides some functionality for the user to jump to a specific slide, and that\’s about it. It doesn\’t have to do crazy transitions or bring out the razzle and dazzle, it just needs to […]
Read MoreLoop through all elements of a class
Looping through all elements of a class (.element-class) — and in the example below, restricting this so that it only hits elements within a container element. So if we have a div with an id of ‘container-div’, which has 6 divs with classes named ‘element-class’, this will loop through each and do whatever we want […]
Read MoreElegantly Run a Function on Window Load or Window Resize
Pretty straightforward, but I wanted to run a function on the window load event, or if the page was resized (like resizing page elements). I was originally doing this in two lines of code (one for loading, one for resizing), but wanted something more elegant: $(window).on(‘load resize’,functionToRun);
Read MoreEasy jQuery Validator Setup
It seems like it always takes me a bit to figure out how to get the super-great jquery validator to work, and I have to go work my way through the documentation on the site — which has a lot of information, but makes it a little harder for me to just set it up […]
Read MoreMaking an Entire Div Clickable
I wanted to make an entire div clickable — the destination for the click is derived from a link within the div that we give a class of ‘main_link’ to. Insert the following jquery code into your page: $(“.stndBox”).click(function(){ window.location=$(this).find(“.main_link”).attr(“href”); }); Your html code will look like the code below. The jquery will grab the […]
Read MoreChanging Values and Properties with jQuery
jQuery excels at making it easy to change values and properties. Here are a few samples: Change a Select Box Value Changing which value is selected in a select box (this will select the item in the select box with the value of 126): $(‘#catID’).val(‘126’); Change the Background Color of a Textbox $(‘#textbox’).css({‘background-color’:’red’}); Checking a […]
Read MorejQuery Effects
Many effects are made easy with jQuery: Hiding and Showing hide Hides an html element, for example: $(‘menu_sub’).hide(); show Shows an html element: $(‘menu_sub’).show(); toggle Switches and elements display — if hidden, it displays it, if it\’s currently displayed, it hides the element. $(‘menu_sub’).toggle(); fadeIn In the code below, the ‘500’ is the speed in […]
Read MorejQuery Ajax
Making calls to the website’s database without page refreshes is pretty easy with jQuery. There are several functions that can be used, including load, get, and post: Load load() provides the ability to load an html file into an element: $(‘#divContent’).load(‘content_file.html’); With load(), you can even specify specific areas of a file to display. The […]
Read MorejQuery Events
Events Run a function (ie: ‘functionName’) when the mouse goes over the ‘a’ tag: $(‘a’).mouseover(functionName); Mouse Events click dblclick mousedown mouseup mouseover mouseout mousemove Document/Window Events load resize scroll unload Form Events submit reset change focus blur Keyboard Events keypress keydown keyup Getting The ID Of The Element That Triggerd An Event Use the ‘event.target.id’ […]
Read More-
Adventure
-
The Built Environment
-
Locations
-
Web Dev