paulirish

What forces layout / reflow

All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.

Generally, all APIs that synchronously provide layout metrics will trigger forced reflow / layout. Read on for additional cases and details.

Element APIs

Getting box metrics

• elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent

laziel

var ctx = null, usingWebAudio = true;

try {
  if (typeof AudioContext !== 'undefined') {
      ctx = new AudioContext();
  } else if (typeof webkitAudioContext !== 'undefined') {
      ctx = new webkitAudioContext();
  } else {
      usingWebAudio = false;
  }

clemblanco

<?php

function hex2rgba($hex) {
	$hex = str_replace("#", "", $hex);
	
	switch (strlen($hex)) {
		case 3 : 
			$r = hexdec(substr($hex, 0, 1).substr($hex, 0, 1));
			$g = hexdec(substr($hex, 1, 1).substr($hex, 1, 1));
			$b = hexdec(substr($hex, 2, 1).substr($hex, 2, 1));

martijn94

<?php

//======================================================================
// Add post state to the projects page
//======================================================================

add_filter( 'display_post_states', 'ecs_add_post_state', 10, 2 );

function ecs_add_post_state( $post_states, $post ) {

robertknight

Notes on selection events in mobile browsers (April 2016)

Notes on events that are fired during text selection in current desktop and mobile browsers.

Testing steps:

1. Serve test.html from local dev server and open on device
2. Make an initial selection via long-press on the text, observing reported events
3. Modify the selection using drag handles and observe reported events

keeferrourke

#!/bin/sh

# Written by: Keefer Rourke <https://krourke.org>
# Based on AUR package <https://aur.archlinux.org/cgit/aur.git/tree/PKGBUILD?h=ttf-google-fonts-git>

# dependancies: fonts-cantarell, ttf-ubuntu-font-family, git
sudo apt-get install fonts-cantarell ttf-ubuntu-font-family git
srcdir="/tmp/google-fonts"
pkgdir="/usr/share/fonts/truetype/google-fonts"
giturl="git://github.com/google/fonts.git"

dtbaker

// This example will add a custom "select" drop down to the "Image Box" 
// This will change the class="" on the rendered image box so we can style the Image Box differently
// based on the selected option from the editor.
// The class will be "my-image-box-style-blue" or "my-image-box-style-green" based on the selected option.

add_action('elementor/element/before_section_end', function( $section, $section_id, $args ) {
	if( $section->get_name() == 'image-box' && $section_id == 'section_image' ){
		// we are at the end of the "section_image" area of the "image-box"
		$section->add_control(

bjorn2404

<?php

/**
 * Add iFrame to allowed wp_kses_post tags
 *
 * @param array  $tags Allowed tags, attributes, and/or entities.
 * @param string $context Context to judge allowed tags by. Allowed values are 'post'.
 *
 * @return array
 */

kameltovic

<form action="" enctype="multipart/form-data" id="file-form" method="POST">
  <div id="upup">
    <h2>Upload update file</h2>
    <p id="progressdiv"><progress max="100" value="0" id="progress" style="display: none;"></progress></p>
    <input type="file" name="file-select"  id="file-select">
    <button type="submit" id="upload-button">Upload</button>
  </div>
</form>
<script type="text/javascript">
  var form = document.getElementById('file-form');

fatorx

var exec = require('child_process').exec

gulp.task('update-templates', function(){
    
    exec('php scripts/update-html.php', function (err, stdout, stderr) {
        console.log(stdout)
        console.log(stderr)
    })
})