Skip to content

Instantly share code, notes, and snippets.

Avatar
🎯
Focusing

Nicole Lambon Takaya213

🎯
Focusing
View GitHub Profile
View scroll-up-bar.css
body {
padding-top: 40px;
}
header {
background: #f5b335;
height: 40px;
position: fixed;
top: 0;
transition: top 0.2s ease-in-out;
@Takaya213
Takaya213 / show-hide-password.js
Created May 2, 2013
A jQuery method to show and hide passwords in forms.
View show-hide-password.js
$(document).ready(function(){
$('.showpassword').each(function (index, input){
var $input = $(input);
$("#passwordshow").click(function () {
var change = $(this).is(":checked") ? "text" : "password";
var text = $(this).is(":checked") ? "Hide Password" : "Show Password";
var rep = $("<input type='" + change + "' />")
.attr("id", $input.attr("id"))
.attr("name", $input.attr("name"))
.attr('class', $input.attr('class'))
@Takaya213
Takaya213 / scroll-effect.js
Created May 2, 2013
An easy way to create a scroll effect on pages from one anchor to another.
View scroll-effect.js
$(document).ready(function(){
$('a').click(function(){
$('html, body').animate({
scrollTop: $( $.attr(this, 'href') ).offset().top
}, 500);
return false;
});
});
@Takaya213
Takaya213 / watermark.js
Created May 2, 2013
A watermark effect for input boxes.
View watermark.js
(function($) {
$.fn.watermark = function() {
return this.each(function() {
var obj = $(this);
var initialText = obj.val();
obj.focus(function() {
if (obj.val() === initialText)
obj.val("");
@Takaya213
Takaya213 / fixed-header.js
Last active Dec 17, 2015
Fixed the header/nav to the top of the page in a slightly different style via a class.
View fixed-header.js
function scrolled_menu() {
if ($(window).scrollTop() > $('header').height()) {
$('header').addClass('fixed_type');
$('html').addClass('fixed_type_html');
} else {
$('header').removeClass('fixed_type');
$('html').removeClass('fixed_type_html');
}
}
@Takaya213
Takaya213 / equal-height.js
Created Jul 5, 2013
Make elements have the same height.
View equal-height.js
$.fn.equalizeHeights = function() {
var maxHeight = this.map(function(i,e) {
return $(e).height();
}).get();
return this.height( Math.max.apply(this, maxHeight) );
};
$('.equal').equalizeHeights();
@Takaya213
Takaya213 / clone_increment.html
Last active Sep 22, 2016
Clone a section of form code and increment the name/is of the inputs.
View clone_increment.html
<div class="input_fields_wrap">
<div>
<input type="text" name="fields[contact][new1][fields][contactName]" /><br />
<input type="text" name="fields[contact][new1][fields][contactSurname]" /><br />
<input type="text" name="fields[contact][new1][fields][contactEmail]" />
</div>
<button class="add_field_button">Add More Fields</button>
</div>
View clearfix-mixin.scss
@mixin clearfix {
&:after {
content: "";
display: table;
clear: both;
}
}
.wrap {
@include clearfix;
View MetaTags.html
<!-- UX Compatible Meta Tag -->
<meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1" />
<!-- Viewport Meta Tag -->
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<!-- Favicon Meta Tag -->
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="assets/images/general/favicon.png" />
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="assets/images/general/favicon.png" />
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="assets/images/general/favicon.png" />
@Takaya213
Takaya213 / vertical-align.css
Created Oct 1, 2015
Vertical Align Anything
View vertical-align.css
.parent-element {
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d;
}
.element {
position: relative;
top: 50%;
transform: translateY(-50%);