Alexey Slobodyansky web2ls

💭

Endeavor

Frontend Engineer

web2ls / CSS: Multiple background including image and transparent color

Last active December 9, 2017 15:22

web2ls / Usefull JS notes

Last active February 21, 2018 07:35

Usefull notes

	1) Get all keys in object and works with them
	const keys = Objects.keys(myObject);
	keys.forEach(function(key) {
	console.log(`${key}: ${myObject[key}`)
	});

	2) Convert value to another notation
	const a = 'ff'; //value in hexidecimal
	const b = parseInt(a, 10); //convert it into decimal

web2ls / flattenArray

Last active October 31, 2017 15:44

Turn array into flat structure via Array.prototype.reduce

	function flatten(arr) {
	if (Array.isArray(arr)) {
	return arr.reduce(function(done,curr){
	return done.concat(flatten(curr));
	}, []);
	} else {
	return arr;
	}
	}

web2ls / arguments

Last active November 2, 2017 08:19

Works with function arguments in JS

	/*Only use:
	arguments.length
	arguments[i] where i is always a valid integer index into the arguments, and can not be out of bound
	Never use arguments directly without .length or [i]
	STRICTLY fn.apply(y, arguments) is ok, nothing else is, e.g. .slice. Function#apply is special.

	Workaround for proxying is to create array in-line:*/

	function doesntLeakArguments() {
	//.length is just an integer, this doesn't leak

web2ls / jQuery Item Filter plugin

Last active August 19, 2017 11:00

jQuery Item Filter plugin

	Select filters button and call webToolsFilter('sortableElementClass') and pass sortable elements class.
	Example:
	HTML markup
	#filters button
	<ul class="works__filters">
	<li class="active-filter" data-category="all">All</li>
	<li data-category="illustration">Illustration</li>
	<li data-category="graphics">Graphics</li>
	<li data-category="video">Video</li>
	<li data-category="web">Web</li>

web2ls / Sticky Footer

Last active July 5, 2017 09:07

Sticky Footer

	//Flexbox case
	===============
	HTML
	===============
	<body>
	<header></header>
	<section class="content"></section>
	<footer></footer>
	</body>

web2ls / Setup BrowserSync for Gulp configuration

Last active April 26, 2017 19:18

Setup BrowserSync for Gulp configuration

	var gulp = require('gulp');
	var browserSync = require('browser-sync');
	var reload = browserSync.reload;

	gulp.task('liveSync', function() {
	browserSync({
	server: {
	baseDir: './'
	},
	open: true,

web2ls / jQuery Detect Page Height

Last active May 28, 2016 16:02

	function heightDetect() {
	$('.main-head').css('height', $(window).height());
	};

	heightDetect();
	$(window).resize(heightDetect);

web2ls / jQuery Page Preloader

Created May 28, 2016 15:54

	//css section
	.loader {
	background: none repeat scroll 0 0 #ffffff;
	bottom: 0;
	height: 100%;
	left: 0;
	position: fixed;
	right: 0;
	top: 0;
	width: 100%;