Press enter to see results or esc to cancel.

Abraham Garcia Abraham Garcia in Javascript/jQuery   Monday, June 8 2020

Create a Dynamic Numbering Down Countdown for a List of Articles jQuery

A Numbering Countdown for Articles or Products with jQuery.

This is a snippet to create a numbering list that count down for jQuery. I used this for counting down articles that the best 20 products sold. Use this as you would like on your projects.  <script> var n = $( ".website .numbering"

Continue reading
Abraham Garcia Abraham Garcia in Javascript/jQuery   Saturday, May 23 2020

How to Change Navbar When You Start Scrolling

Scroll and Change the Navigation with Simple jQuery and CSS

Use these snippets to change the navigation color when you scroll down on your website.  JS $(function () { $(document).scroll(function () { var $nav = $(".navbar-fixed-top"); $nav.toggleClass('scrolled', $(this).scrollTop() >

Continue reading
Abraham Garcia Abraham Garcia in Javascript/jQuery   Friday, May 15 2020

Match Height CSS and JS Example

A jQuery Library to Have Divs on the same Height. Simple Snippet of Code. Make Your Divs all the Same Height.

A known and used library for Match Height in jQuery.  https://github.com/liabru/jquery-match-height  Simply include the JS Script <script src="jquery.matchHeight.js" type="text/javascript"></script> And add the class .item

Continue reading
Abraham Garcia Abraham Garcia in Javascript/jQuery   Saturday, May 2 2020

Vue JS Components and Syntax - Create Components on Vue.js

How to create reusable Components in Vue.Js. A Short snippet and code sample. Get Started Quickly with Vue.JS

A little syntax about Vue.JS and components. Define a Component and reuse it on your projects! <abraham-card title="Test Card for Abraham" body="Some quick example text to build on the card title and make up the bulk of the card's content."

Continue reading
Abraham Garcia Abraham Garcia in Javascript/jQuery   Friday, March 27 2020

Default Ordering Sorting on DataTable.js

How to change the column that DataTable.js Sorts by Default

How to sort by default row on DataTable.js. The number 3 is the column you would like to default the sorting. $(document).ready(function() { $('#example').DataTable( { "order": [[ 3, "desc" ]] } ); } );  

Continue reading
Abraham Garcia Abraham Garcia in Javascript/jQuery   Tuesday, March 24 2020

How to Set Amount of Rows that DataTable Displays

DataTables.js Is a Great JS Table Plugin. Display more than the default rows with this simple plugin option.

This is a snippet that determines the amount of records that will be outputed in the datatable.js plugin. Great plugin to make your html tables nice.  $(document).ready( function () { var table = $('#example').DataTable( { pageLength :

Continue reading
Abraham Garcia Abraham Garcia in Javascript/jQuery   Friday, December 13 2019

Disable Weekday from Datepicker JS

How to disabled Friday, Saturday, or Sunday from Datepicker JS. A Simple Script

This is a snippet to disable Friday, Saturday, and Sunday on the JS Datepicker.  <script> jQuery(document).ready(function($){ jQuery("#datepicker2").datepicker({ minDate: new Date(), dateFormat: 'dd-mm-yy', beforeShowDay:

Continue reading
Abraham Garcia Abraham Garcia in Javascript/jQuery   Monday, November 25 2019

Remove All Matching Classes From Page jQuery

How to Remove All Classes from HTML DOM. This matches for similar classes and removes them.

This is a small snippet on how to remove all classes from matched class on jQuery.  $('#builder [class*="ui-id-"]').removeClass(function(i, j) { return j.match(/ui-id-/g).join(" "); }); Full

Continue reading
Abraham Garcia Abraham Garcia in Javascript/jQuery   Saturday, November 16 2019

Stripe New JS Button Example

This is the New Stripe JS Integration with PHP. I had not done this in a while so it was a little hard getting integrated, but it was fun.

These are the code snippets to get started with the New Stripe JS Button. HTML <div id="card-element"> <!-- A Stripe Element will be inserted here. --> </div> <!-- Used to display form errors. --> <div

Continue reading
Abraham Garcia Abraham Garcia in Javascript/jQuery   Friday, November 8 2019

How to Select all Text in a Input Box with One Click

Use OnClick to Select all text in a textbox to copy and paste fast. Useful for developers that need sharable links.

This is a code snippet to select all text in a textbox with javascript.  <input onClick="this.select();" value="Sample Text" /> or <input onClick="this.setSelectionRange(0, this.value.length)" value="Sample Text" />  

Continue reading