Den 0632347878
0632347878
/ config.json
Created
September 27, 2016 23:46
— forked from anonymous/config.json
Bootstrap Customizer Config
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| { | |
| "vars": { | |
| "@gray-base": "#000", | |
| "@gray-darker": "lighten(@gray-base, 13.5%)", | |
| "@gray-dark": "lighten(@gray-base, 20%)", | |
| "@gray": "lighten(@gray-base, 33.5%)", | |
| "@gray-light": "lighten(@gray-base, 46.7%)", | |
| "@gray-lighter": "lighten(@gray-base, 93.5%)", | |
| "@brand-primary": "darken(#428bca, 6.5%)", | |
| "@brand-success": "#5cb85c", |
0632347878
/ onClick dropdown
Created
October 2, 2016 11:17
при клике на globe мы обращаемся к icons и показываем их при повторном клике- скрываем
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| $(function(){ | |
| $('.globe').on('click', function(){ <!--при клике на globe мы обращаемся к icons и показываем их при повторном клике- скрываем--> | |
| $('.icons').slideToggle(); | |
| }); | |
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // Mixin | |
| .clearfix() { | |
| &:before, | |
| &:after { | |
| content: " "; | |
| display: table; | |
| } | |
| &:after { | |
| clear: both; | |
| } |
0632347878
/ Retina images
Created
October 2, 2016 11:46
Specify two image paths and the @1x image dimensions, and Bootstrap will provide an @2x media query. If you have many images to serve, consider writing your retina image CSS manually in a single media query.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| .img-retina(@file-1x; @file-2x; @width-1x; @height-1x) { | |
| background-image: url("@{file-1x}"); | |
| @media | |
| only screen and (-webkit-min-device-pixel-ratio: 2), | |
| only screen and ( min--moz-device-pixel-ratio: 2), | |
| only screen and ( -o-min-device-pixel-ratio: 2/1), | |
| only screen and ( min-device-pixel-ratio: 2), | |
| only screen and ( min-resolution: 192dpi), | |
| only screen and ( min-resolution: 2dppx) { |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /*Smartphones*/ | |
| @media only screen and (max-width: 480px) {} | |
| /* Small devices (tablets, 768px and up) */ | |
| @media only screen and (max-width: 767px) {} | |
| /* Medium devices (desktops, 992px and up) */ | |
| @media only screen and (max-width: 992px) {} | |
| /* Large devices (large desktops, 1200px and up) */ |
0632347878
/ Relatively position with transform
Created
October 2, 2016 17:07
positioning relative to parent
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| .positionedBlock { | |
| position: absolute; | |
| left: 50%; | |
| top: 50%; | |
| transform: translateX(-50%) translateY(-50%); | |
| max-width: 700px; | |
| width: 100%; | |
| } | |
| .parent { | |
| position: relative; |
0632347878
/ jqwery
Created
October 10, 2016 13:38
page to scrool, fix menu on top, processing links on click
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| //Фиксация меню сверху | |
| var nav= $(".navigation"); | |
| if (pageYOffset>499) { | |
| nav.addClass("fix"); | |
| } | |
| window.onscroll = function() { | |
| if (pageYOffset>499) { | |
| nav.addClass("fix"); | |
| } | |
| if (pageYOffset<=499) { |
0632347878
/ Vertical align
Created
October 20, 2016 20:53
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <html> | |
| <head> | |
| <style type="text/css"> | |
| .box { position: fixed; top: 0px; left: 0px; width: 100%; height: 100%; display: block; text-align: center; overflow: auto; background-color: #999; } | |
| .box:before { display: inline-block; height: 100%; vertical-align: middle; content: ''; } | |
| .dialog { position: relative; display: inline-block; vertical-align: middle; width: 300px; background-color: #FFF; color: #000; padding: 20px; text-align: left; } | |
| </style> | |
| </head> | |
| <body> | |
| <div class="box"> |
0632347878
/ JavaScript чтобы создать иллюзию перелистывания страниц
Created
October 23, 2016 21:17
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Мы можем использовать JavaScript чтобы создать иллюзию перелистывания страниц. | |
| $('nav').on('click', function() { | |
| if ( $(this).hasClass('down') ) { | |
| var movePos = $(window).scrollTop() + $(window).height(); | |
| } | |
| if ( $(this).hasClass('up') ) { | |
| var movePos = $(window).scrollTop() - $(window).height(); |
0632347878
/ Responsive img
Created
October 23, 2016 21:20
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| img { | |
| width: auto; /* Автоматическая ширина для пропорциональности высоты */ | |
| max-width: 100%; /* Не больше ширины родительского элемента */ | |
| max-height: 90vh; /* Не превышая высоту viewport */ | |
| margin: 2rem auto; | |
| } |
OlderNewer