Skip to content

Instantly share code, notes, and snippets.

@shanecarmody
shanecarmody / attribute-selectors.md
Last active June 14, 2017 14:33
CSS attribute selectors with special symbols/characters
Example Classification Explanation
a[href*="login"] Attribute Contains Selector Selects an element if the given attribute value contains at least once instance of the value stated
a[href^="https://"] Attribute Begins With Selector Selects an element if the given attribute value begins with the value stated
a[href$=".pdf"] Attribute Ends With Selector Selects an element if the given attribute value ends with the value stated
a[rel~="tag"] Attribute Spaced Selector Selects an element if the given attribute value is whitespace-separated with one word being exactly as stated
a[lang|="en"] Attribute Hyphenated Selector Selects an element if the given attribute value is hyphen-separated and begins with the word stated
@shanecarmody
shanecarmody / responsive-iframes.js
Last active June 14, 2017 14:22
Make iframes responsive using JS
// This is a slightly modified technique of the one found on:
// https://css-tricks.com/NetMag/FluidWidthVideo/Article-FluidWidthVideo.php
(function ($) {
'use strict';
let $container = $('.js-responsive-iframes-container');
let $containerIframes = $container.find('iframe');
// Figure out and save aspect ratio for each iframe
@shanecarmody
shanecarmody / scrollToAnchor.js
Last active November 14, 2017 13:05
Use an anchor tags href value as the scrollTo target
// Smooth scrolling to anchors
//
// This is a slightly modified version of the script provided by CSS Tricks
// https://css-tricks.com/snippets/jquery/smooth-scrolling/
(function ($) {
// Select all links with hashes
$('a[href*="#"]')
// Remove links that don't actually link to anything
.not('[href="#"]')