JomalJohny

<div class="content">
  <h1 class="content-title">Gallery</h1>
  
  <div class="gallery js-gallery">
    <div class="gallery-item">
      <div class="gallery-img-holder js-gallery-popup">
        <img src="https://picsum.photos/600/500" alt="" class="gallery-img">
      </div>
    </div>
    <div class="gallery-item">

JomalJohny

<div id="particles-js"></div>

JomalJohny

<?php // ONLY COPY THIS LINE IF NEEDED!

/**
 * Adds the ability to sort products in the shop based on the SKU
 * Can be combined with tips here to display the SKU on the shop page: https://www.skyverge.com/blog/add-information-to-woocommerce-shop-page/
 *
 * @param array $args the sorting args
 * @return array updated args
 */
function sv_add_sku_sorting( $args ) {

JomalJohny

<div class="container">
  <div class="row">
    <div class="col s10 offset s1">
      <h4>noUiSlider</h4>
      <br />
      <div id="slider"></div>
    </div>
    <div class="col s10 offset s1">
      <h4>Range</h4>
      <p class="range-field">

JomalJohny

Bootstrap Progress Bar Percentage

Just playing around with the twitter bootstrap progress bar, and having the percentage outside/below the bar, I think this looks kind of nice.

A Pen by Christophor Wilson on CodePen.

License.

JomalJohny

<h2>
  <a href=''>:hover, please</a>
</h2>

<h2 class='uno'>
  <a href=''>Now here</a>
</h2>

<h2 class='dos bis'>
  <a href=''>Around and inside I</a>

JomalJohny

CSS dot pattern/grid background

Simple technique to create a dot pattern or dot grid background.

Support: all modern browsers and IE9+

A Pen by Edmundo Santos on CodePen.

License.

JomalJohny

.center
		p.swipe 
			span.sentence.sentence--show Do you not think so far ahead? Because I've been thinking about forever
			span.sentence I remember how I forget how you feel. How you were the first for me

a(href="http://nathan.tokyo" target="_blank").sig NATHAN.TOKYO

JomalJohny

Animate multiple Text Elements dynamically - Pure CSS

A pure CSS code which gives you the ability to animate multiple text elements within multiple blocks. All you have to do is to create a new element in the HTML side and it will be automatically animated. There is a limitation in the number of rows and blocks that you can add and it's set to 5 for both but you can easily increase it by copying the code. It's highly important to notice that you can't change the configuration of the movement due the lack of ability to pass these new configurations to the @keyframes with pure CSS, if you know any way to go around this hack then please let me know, but still, you can do it but then you have to calculate the new steps values according to the equation provided in the 'STEPS' VALUES CALCULATOR' section and then pass them manually to the @keyframes accordingly.

A Pen by [Tarek Alhomsi](https://codepen.io/tarekalhoms

JomalJohny

<h1>Smooth Accordion Dropdown Menu Demo</h1>
<!-- Contenedor -->
<ul id="accordion" class="accordion">
  <li>
    <div class="link"><i class="fa fa-database"></i>Web Design<i class="fa fa-chevron-down"></i></div>
    <ul class="submenu">
      <li><a href="#">Photoshop</a></li>
      <li><a href="#">HTML</a></li>
      <li><a href="#">CSS</a></li>
    </ul>