Skip to content

Instantly share code, notes, and snippets.

@olehi94
olehi94 / smooth_scrolling.js
Created December 8, 2020 15:04
Smooth scrolling
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
anchor.addEventListener('click', function (e) {
e.preventDefault();
document.querySelector(this.getAttribute('href')).scrollIntoView({
behavior: 'smooth'
});
});
});

Асинхронные скрипты: defer/async

  • Специальные атрибуты async и defer используются для того, чтобы пока грузится внешний скрипт – браузер показал остальную (следующую за ним) часть страницы. Без них этого не происходит.
  • Разница между async и defer: атрибут defer сохраняет относительную последовательность скриптов, а async – нет. Кроме того, defer всегда ждёт, пока весь HTML-документ будет готов, а async – нет.

Директива use strict

  • Директива выглядит как строка "use strict"; или 'use strict'; и ставится в начале скрипта.

Например:

"use strict";
@olehi94
olehi94 / index.html
Created January 18, 2019 11:03
HTML skeleton/template file.
<!DOCTYPE html>
<html lang="zxx">
<head>
<meta charset="utf-8">
<title>Title</title>
<meta name="description" content="Description">
<meta name="keywords" content="Keywords">
<meta name="author" content="Author">
<meta name="viewport" content="width=device-width, initial-scale=1">
@olehi94
olehi94 / README.md
Last active January 15, 2019 13:22
How to find all form elements using in D8.

Global project search phrase:

  • @FormElement(
  • '#type' =>
  • @RenderElement(
@olehi94
olehi94 / README.md
Last active January 15, 2019 12:29
Attaching JS assets into the <head> section

By default, Drupal, will attaches the JS assets at page bottom to avoid some frequents problems like: DOM content loading block, access to unready DOM element from jquery code, ecc... If for certain reason it's needed to attach JS assets into the section it's possible the use of header option, in this way:

  version: 1.x
  header: true
  js:
    js/cuddly-slider.js: {}

So, now, the js/curry-slider.js will be attached at page top.

@olehi94
olehi94 / module_name.links.menu.yml
Last active January 10, 2019 16:02
Additional examples of module menu link.
@olehi94
olehi94 / description.md
Last active January 10, 2019 01:34
Complete example module_name.info.yml

dependencies - A list of other modules your module depends on. Dependencies should be namespaced in the format {project}:{module}, where {project} is the project name as it appears in the Drupal.org URL (e.g. drupal.org/project/views) and {module} is the module's machine name. Dependencies can also include version restrictions, for examplewebform:webform (>=8.x-5.x). Note that if your module has dependencies on other contributed modules or libraries, these should be declared in the module's composer.json file.

test_dependencies - A list of other modules (in the same format as dependencies) that are needed to run certain automated tests for your module on Drupal's automated test runner ("DrupalCI"),

@olehi94
olehi94 / DatabaseConfiguration.php
Last active January 9, 2019 15:06
Dependency Injection.
<?php
namespace DesignPatterns\Structural\DependencyInjection;
/**
* Class DatabaseConfiguration
*
* @package DesignPatterns\Structural\DependencyInjection
*/
class DatabaseConfiguration {
@olehi94
olehi94 / index.php
Last active January 9, 2019 15:34
Example using namespaces.
<?php
use Lib\Eddard as AnotherEddard;
class Eddard {
public static function whoAmI() {
return 'It\'s method whoAmI in index.php.';
}