JSFiddle

  • Slick Carousel Demo/a11y

    Update for Accessibility

    /*
         _ _      _       _
     ___| (_) ___| | __  (_)___
    / __| | |/ __| |/ /  | / __|
    \__ \ | | (__|   < _ | \__ \
    |___/_|_|\___|_|\_(_)/ |___/
                       |__/
    
     Version: 1.6.0
      Author: Ken Wheeler
     Website: http://kenwheeler.github.io
        Docs: http://kenwheeler.github.io/slick
        Repo: http://github.com/kenwheeler/slick
      Issues: http://github.com/kenwheeler/slick/issues
    
     */
    /* global window, document, define, jQuery, setInterval, clearInterval */
    (function(factory) {
        'use strict';
        if (typeof define === 'function' && define.amd) {
            define(['jquery'], factory);
        } else if (typeof exports !== 'undefined') {
            module.exports = factory(require('jquery'));
        } else {
            factory(jQuery);
        }
    
    }(function($) {
        'use strict';
        var Slick = window.Slick || {};
    
        Slick = (function() {
    
            var instanceUid = 0;
    
            function Slick(element, settings) {
    
                var _ = this, dataSettings;
    
                _.defaults = {
                    accessibility: true,
                    adaptiveHeight: false,
                    appendArrows: $(element),
                    appendDots: $(element),
                    arrows: true,
                    asNavFor: null,
                    prevArrow: '<button data-role="none" class="slick-prev">Previous</button>',
                    nextArrow: '<button data-role="none" class="slick-next">Next</button>',
                    autoplay: false ...
  • jQuery UI: Date Picker displayed in UI Dialog

    Displaying the UI Datepicker as a dialog.

        $( "#Field" ).datepicker({
        	minDate: "1/13/2017",
         showButtonPanel: true,
         closeText : "Close"
        }).datepicker("setDate", new Date());;
        
    
    
  • Demo for jQuery Masked Input #1 is the latest revision

    Stack Overflow demo for the jQuery Masked Input plugin

    // set current date
    var today = new Date();
    var dd = today.getDate();
    var mm = today.getMonth()+1; //January is 0!
    
    var ...
  • Table Cell context #3 is the latest revision

    Table cell context using title attribute

    
    
    
    $('td').each(function(index){
    var $td = $(this),
            $th = $td.closest('table').find('th').eq($td.index()),
            $rowth = $td.parent('tr ...
  • Validation - error zone #10 is the latest revision

    error zone at beginning of form, outlining issues.

     $(document).ready(function() {
    
       // a11y - specify field container for error/success states; addresses different parent structure depending on field type
       var ...
  • "Singleton" Bootstrap Popover with Close Button #24 is the latest revision

    This bootstrap popover extension adds close button to popovers and limits the number of open popovers to single one.

    $.fn.extend({
        popoverClosable: function (options) {
            var defaults = {
                template:
                    '<div class="popover">\
    <div class="arrow"></div>\
    <div class="popover-header">\
    <button type="button" class="close" data-dismiss="popover" aria-hidden="true">&times;</button>\
    <h3 class="popover-title"></h3>\
    </div>\
    <div class="popover-content"></div>\
    </div>'
            };
            options = $.extend({}, defaults, options);
            var $popover_togglers = this;
            $popover_togglers.popover(options);
            $popover_togglers.on ...
  • Validation - error zone #19 is the latest revision

    error zone at beginning of form, outlining issues.

     $(document).ready(function() {
    
    
       var submitted = false;
       //validation rules
       $("#example2").validate({
         //set this to false if you don't what to ...
  • Demo of simple tabs without jQuery UI

    jQuery 1.7.2, HTML, CSS, JavaScript

    $(document).ready(function() {
        $(".tabs-menu a").click(function(event) {
            event.preventDefault();
            $(this).parent().addClass("current");
            $(this).parent().siblings().removeClass("current");
            var ...
  • Pickadate.js #2 is the latest revision

    Bootstrap 3 table compatibility issue

    $(document).ready(function() {
        $('.datepicker').pickadate();
        $('.timepicker').pickatime();
    });
  • Google Places Autocomplete #260 is the latest revision

    Make an autocomplete address field using Google Place Autocomplete api

    var input = document.getElementById('searchTextField');
    var options = {componentRestrictions: {country: 'us'}};
        
    new google.maps.places.Autocomplete(input, options);