Skip to content

Instantly share code, notes, and snippets.

View mojaray2k's full-sized avatar

Amen Moja Ra mojaray2k

33 followers · 97 following
  • Miami, Fl
View GitHub Profile
@mojaray2k
mojaray2k / jquery-exists.html
Created September 9, 2013 01:37
By now you are probably used to checking the length property of jQuery objects to determine whether the element you attempted to select exists. The following trick will make your code a bit more expressive and easier to read:
<!DOCTYPE html>
<html>
<head>
<title>jQuery Exists Function</title>
</head>
<body>
<div id="elem"></div>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<meta charset=utf-8 />
@mojaray2k
mojaray2k / second-argument.html
Last active December 22, 2015 15:09
We can now write some jQuery to demonstrate what the second argument does. The context that we give in the first case, is roughly equivalent to using the find() method. The second example saves us from having to call each of the methods individually.
<!DOCTYPE html>
<html>
<head>
<meta name="description" content="We can now write some jQuery to demonstrate what the second argument does:" />
<meta charset=utf-8 />
<title>jQuery Function Second Argument</title>
</head>
<body>
<ul id="firstList">
<li>one</li>
@mojaray2k
mojaray2k / external-links-icons.html
Last active December 22, 2015 21:29
This is a good example of how to loop through a group of links and place an icon on external links using jQuery.
@mojaray2k
mojaray2k / jquery-end.html
Last active December 22, 2015 21:29
The jQuery end() method restores your collection to what is was before the last time it was modified (this includes filtering, finding, slicing, and more). Below is an example:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Mastering the jQuery End Method</title>
</head>
<body>
<ul id="meals">
<li>
<ul class="breakfast">
@mojaray2k
mojaray2k / context-menu.js
Created September 12, 2013 06:26
If you want to give your web application a more native feel, you might want to disable right clicking, when a right click occurs, browsers emit the contextmenu event and as with any other event, you can listen for it, and call the preventDefault(0 method. You can take this a few steps further and even display an entirely custom context menu by u…
$(function)(){
$(document).on('contextmenu', function(e){
e.preventDefault();
});
});
@mojaray2k
mojaray2k / JavaScript 1
Created September 12, 2013 06:54
Some sites like StumbleUpon and LinkedIn show your site with their bar on top of the page. This is done by including your page in an iframe. You only need to compare the window object of your page, to window.top. Normally, they are the same object, but if your site is being show in an iframe, they will differ. Then you simply re-direct the brows…
//no-iframe.js
if(window != window.top){
window.top.location = window.location;
}
@mojaray2k
mojaray2k / Browsers 1
Created September 12, 2013 07:12
The following code sample is an example of how to make inline style sheets editable in the browser like other elements.
<!--editable-inline-stylesheet.html -->
<style type="text/css" id="regular-style-block">
html{
background-color:#222229;
position:relative;
}
body{
font:14px/1.3 'Segoe UI', Arial, sans-serif;
color:#e4e4e9;
@mojaray2k
mojaray2k / unselectable-text.js
Created September 12, 2013 07:20
In certain situations, you might want to prevent text on the page from being selectable. This is useful when building interfaces that can be dragged or reordered, as you don't want users to select text from the page by accident. Here is a snippet that does this and works in all browsers.
$('p.descr').attr('unselectable','on')
.css('user-select','none')
.on('select-start', false);
@mojaray2k
mojaray2k / jQuery 1
Created September 14, 2013 17:18
The best first step to improving the JavaScript performance of your web site is to simply include the latest version of jQuery, as every new release brings more optimizations and bug fixes. Requesting jQuery from a CDN is also a good choice, as it will minimize the loading time of your site (a CDN is faster to serve the library, and many people …
<!-- jquery-cdn-js.html-->
<!-- Case 1 - requesting jQuery from the official CDN -->
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<!-- Case 2 - requesting jQuery from Googles CDN (notice the protocol) -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<!-- Case 3 - requesting the latest minor 1.10.x version (only cached for an hour) -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10/jquery.min.js"></script>
@mojaray2k
mojaray2k / Arrays 1
Last active December 23, 2015 01:59
Grouping inserts into a single operation is faster as it causes the page to be redrawn only once. The same goes for style properties, where it's better to assign a css class than apply multiple styles.
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>UseElement Grouping to Keep DOM Touches at a Minimum</title>
</head>
<body>
<div id="elem"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>