Skip to content

Instantly share code, notes, and snippets.

@Scretch-1
Scretch-1 / Js Up Button
Last active October 31, 2016 03:35
js кнопка наверх с кастомизацией появления
//Кнопка "Наверх"
//Документация:
//http://api.jquery.com/scrolltop/
//http://api.jquery.com/animate/
// Пример <a href="#$" id="top" style="display: none"><img src="img/up.png" alt="top"></a>
// основной оператор
$("#top").click(function () {
$("body, html").animate({
scrollTop: "0px"
@Scretch-1
Scretch-1 / js плавное увеличение чисел
Created October 27, 2016 08:46
JS скрипт плавного увеличения чисел
<!-- Источник http://codepen.io/shivasurya/pen/FatiB -->
<!-- //-- В файл HTML --// -->
<div><span class="count">200</span></div>
<div><span class="count">1000</span></div>
<div><span class="count">853</span></div>
<div><span class="count">154</span></div>
<div><span class="count">10</span></div>
<div><span class="count">87</span></div>
@Scretch-1
Scretch-1 / SASS миксин для параллакса
Last active October 25, 2016 08:58
полезный миксин для параллакса (.sass)
Источник http://codepen.io/scottkellum/pen/bHEcA
//-- В ФАЙЛ vars.sass --//
// parallax variables
$parallax-perspective: 1 !default
$parallax-element: "body" !default
$parallax-ios: true !default
//-end parallax variables
@Scretch-1
Scretch-1 / SCSS responsive mixins
Last active February 22, 2017 04:04
Полезные миксины для адаптирования проектов (.scss)
//-- В ФАЙЛ _vars.sass --//
//font-size
$df: 1em;
//font-media
$dfm: 3.3vw;
// Media enquiries
$large: 1199px;
$medium: 991px;
@Scretch-1
Scretch-1 / SASS responsive mixins
Last active November 12, 2016 04:27
Полезные миксины для адаптирования проектов (.sass)
//-- В ФАЙЛ _vars.sass --//
//font-size
$df: 1em
//font-media
$dfm: 3.3vw
// Media enquiries
$large: 1199px
$medium: 991px
@Scretch-1
Scretch-1 / CSS Tabs
Created April 26, 2016 05:53
Табуляция CSS простая кастомизированная
//--HTML--//
<div class="worko-tabs">
<input class="state" type="radio" title="tab-one" name="tabs-state" id="tab-one" checked />
<input class="state" type="radio" title="tab-two" name="tabs-state" id="tab-two" />
<input class="state" type="radio" title="tab-three" name="tabs-state" id="tab-three" />
<input class="state" type="radio" title="tab-four" name="tabs-state" id="tab-four" />
<div class="tabs flex-tabs">
<label for="tab-one" id="tab-one-label" class="tab">Газ</label>
@Scretch-1
Scretch-1 / Input type FILE
Created April 26, 2016 03:46
Кастомный тип поля загрузки файлов
//--HTML--//
<label class="file" title=""><input type="file" onchange="this.parentNode.setAttribute('title', this.value.replace(/^.*[\\/]/, ''))" /></label>
//--end HTML--//
//--CSS--//
label.file input {
position: absolute;
width: 0;
overflow: hidden;
opacity: 0;
<-- HTML -->
<div class="hamburger-menu">
<div class="bar"></div>
</div>
<-- END HTML -->
<-- SCSS -->
//Меню гамбургер -------//
$bar-width: 50px;
$bar-height: 5px;
@Scretch-1
Scretch-1 / Drag and drop
Created March 18, 2016 06:04
Drag and drop вставка картинки в окошко
//--HTMl--//
<div class="one_col file-upload">
<div id="file">
<ul class="image-list">
<li>
<i class="fa fa-plus-circle"></i>
</li>
</ul>
</div>
<input type="file" class="file" name="images" id="images"/>
@Scretch-1
Scretch-1 / tabs
Created February 26, 2016 20:37
jQ Tabs Простой пример табов (custom)
//--HTML--//
<nav class="bottom_bar">
<ul>
<li><p>+7 (495) 979-4994</p></li>
<li><p>Московская область Ногинский район п. Новые дома дом 1Б</p></li>
<li><a href="mailto:[email protected]" class="gray">E-mail: [email protected]</a></li>
<li><a href="#" title="@"><img src="img/metr_2.png" alt="ment"></a></li>
<li><a href="#" title="@"><img src="img/ment_1.png" alt="ment"></a></li>
</ul>
</nav>