JSFiddle

  • ECMA6 Arrow Function - Let and Const

    The difference between let and const in arrow functions.

    let _CLICK = document.querySelector('#click')
    let _DIV = document.querySelector('div')
    let _SAY = "Hello world! Welcome,"
    const _DONT_SAY = "It hasn't ...
  • New Split Using Prototype

    Split any thing with javascript prototype function. This can be use in a gulpfile.js to open files and paths.

    // GULP DEPENDENCIES
    var gulp = require('gulp');
    var utilC = require('gulp-util');
    var autoprefixer = require('gulp-autoprefixer');
    var compass = require('gulp-compass');
    var exec ...
  • Invite Friend on Facebook

    Invite friends to like your page on Facebook using automatic button click.

    // Log console messages
    (function() {
    
        var checkElem = document.querySelectorAll('.uiButton._1sm:not(.clickedIt)');
        var elem = checkElem.length > 0 ? checkElem : 'null';
    
        console ...
  • Scroll Navigation with jQuery

    Scroll Navigation with jQuery. Bollets parallax.

    (function() {
        var menu = $('#fixed-bollets li a[href^="#"]');
    
        function addClass(el) {
            menu.removeClass('active');
            $(el).addClass('active');
        };
    
        $(menu).on('click', function ...
  • Google Material Design Input Boxes

    Using label float and validate input boxes with JS and without js (Just CSS).

    // Valid input With JS
    var textinput = document.querySelectorAll('.textinput'),
      textlabel = document.querySelectorAll('.textlabel');
    
    for (var i = 0, max = textinput.length ...
  • Keyboard numbers

    Get the numbers and do something - Effect ripple material design.

    (function() {
      // Take some variables.
      var btnMaterial = document.querySelectorAll('.btnMaterial');
    
      // Button numbers - keyboard
      for (var i = 0; i < btnMaterial.length; i++) {
        btnMaterial[i].addEventListener('click', function(getPage) {
          add_number(this.value);
          btn_effect(this, getPage);
        });
      }
    
      // Input number
      function add_number(result) {
        var input_number = document.querySelector('.input_number'),
          get_value_p = 0;
    
        input_number.value += result;
    
        if (input_number.value.length >= 4) {
          get_value_p = input_number ...
  • Material Design Effect Click

    Material Design Effect Click with Pure JavaScript.

    (function() {
      // Take some variables.
      var calcSize, xWidth, yHeight;
      var btnMaterial = document.querySelectorAll('.btnMaterial'),
        span = document.createElement("span");
      span.className = "effect ...
  • Get Pressed Key

    Get pressed key and loop it.

    (function() {
      document.onkeypress = function(evt) {
        var charCode = evt.keyCode;
        var charPressed = String.fromCharCode(charCode);
    
        for (var i = 0; i < charPressed ...
  • Vector Variable - Loop

    Loop in a vector variable.

    (function() {
        // CREATE THE VECTORS
        let names = [
            "Person1",
            "Person2",
            "Person3"
        ];
    
        // READ THE NAMES - LOOP
        for (var count = 0; count in names ...
  • Validate - Input Number

    It is just validate an empty input.

    (function() {
        let $ = document.querySelector.bind(document);
    
        $(".openBtn").addEventListener("click", (e) => {
            let inputNumber = $("#number"),
                message = $(".msg"),
    			result = $(".val");
    
            if (inputNumber.value ...
  • Spell Using Prototype

    Spell any word using prototype JavaScript.

    let $ = document.querySelector.bind(document);
    
    let x = $('.text'),
        input = $('#txt'),
        btn = $('#send');
    
    String.prototype.spell = function() {
        x.innerHTML =
            this.toUpperCase ...
  • 1
  • 2