carlos-sanchez’s gists

carlos-sanchez / iphone-calls-sms.html

Created November 14, 2013 04:32

iPhone calls and sms

	<a href="tel:1-408-555-5555">1-408-555-5555</a>
	<a href="sms:1-408-555-1212">New SMS Message</a>

carlos-sanchez / get-directions.html

Created November 14, 2013 04:30

Get Directions on Google Maps. Simple yet powerful code to create a form where the user can enter his location to get directions to a specific place. Very useful for contact pages.

	<form action="http://maps.google.com/maps" method="get" target="_blank">
	<label for="saddr">Enter your location</label>
	<input type="text" name="saddr" />
	<input type="hidden" name="daddr" value="350 5th Ave New York, NY 10018 (Empire State Building)" />
	<input type="submit" value="Get directions" />
	</form>

carlos-sanchez / form-autocomplete.html

Created November 14, 2013 04:29

Form autocomplete. Example: http://davidwalsh.name/demo/datalist.php

	<input name="frameworks" list="frameworks" />

	<datalist id="frameworks">
	<option value="MooTools">
	<option value="Moobile">
	<option value="Dojo Toolkit">
	<option value="jQuery">
	<option value="YUI">
	</datalist>

carlos-sanchez / force-file-download.html

Created November 14, 2013 04:28

Force File Download

	<!-- will download as "expenses.pdf" -->
	<a href="/files/adlafjlxjewfasd89asd8f.pdf" download="expenses.pdf">Download Your Expense Report</a>

carlos-sanchez / email-validation.html

Created November 14, 2013 04:27

Email validation. HTML5 allows, among other things, to validate emails using a regular expression pattern. Here is a ready to use input field with the regexp pattern to validate an email address.

<input type="text" title="email" required pattern="[^@]+@[^@]+\.[a-zA-Z]{2,6}" />

carlos-sanchez / countries-dropdown-list.html

Created November 14, 2013 04:27

Countries Dropdown List

carlos-sanchez / javascript-redirect.js

Last active December 28, 2015 06:59

Redirect. http://css-tricks.com/redirect-web-page/

	// JS Option
	window.location = "http://new-website.com";

carlos-sanchez / basics.js

Created November 14, 2013 04:25

Basics. Source: http://www.catswhocode.com/blog/manipulating-the-dom-with-jquery-10-useful-code-snippets


	//Add a CSS class to a specific element
	$('#myelement').addClass('myclass');

	//Removing a CSS class from a specific element
	$('#myelement').removeClass('myclass');

	//Check if a specific element has a CSS class
	$(id).hasClass(class)

carlos-sanchez / navigation-sans-current.txt

Created November 14, 2013 04:19

Same navigation code on every page (replaces current)

	Most websites highlight the navigation item of the user's location in the website, to help users orientate themselves. This is a fundamental requirement for basic usability, but can be a pain as you'll need to tweak the HTML code behind the navigation for each and every page. So can we have the best of both worlds? Is it possible to have the navigation highlighted on every page, without having to tweak the HTML code on each and every page? Of course it is...

	First of all, you'll need to assign a class to each navigation item:

	<ul>
	<li><a href="#" class="home">Home</a></li>
	<li><a href="#" class="about">About us</a></li>
	<li><a href="#" class="contact">Contact us</a></li>
	</ul>

carlos-sanchez / css-shorthands.txt

Created November 14, 2013 04:13

CSS Shorthand Rules

	font: bold italic small-caps 1em/1.5em verdana,sans-serif

	background: [background-color] [background-image] [background-repeat]
	[background-attachment] [background-position] / [ background-size]
	[background-origin] [background-clip];

	Notice the forward slash, similar to how font shorthand and border-radius can be written. The slash allows you to include a background-size value after the position in supporting browsers.

	In addition, you also have up to two optional declarations for background-origin and background-clip.

	<select>
	<option value=" " selected>(please select a country)</option>
	<option value="--">none</option>
	<option value="AF">Afghanistan</option>
	<option value="AL">Albania</option>
	<option value="DZ">Algeria</option>
	<option value="AS">American Samoa</option>
	<option value="AD">Andorra</option>
	<option value="AO">Angola</option>
	<option value="AI">Anguilla</option>

Carlos Sánchez carlos-sanchez