Іноді при додаванні карти google на сайт, при прокручуванні сторінки і попадання курсора на карту - карта починає збільшуватися, а сторінка сайту перестає крутитися. Це відбувається тому що фокус курсора зависає над картою. Щоб цього уникнути можна використовувати хітрий трюк, який поверх карти розтягує прозорий блок а при кліці на ньому ця область забирається і можна працювати з мапою.

// наша мапа iframe та блок поверх неї
<div class="overlay" onClick="style.pointerEvents='none'"></div>

<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d15283.833165817221!2d-118.49667288145102!3d34.01360875883708!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x0%3A0x1ffe328381544853!2sGoogle+Inc!5e0!3m2!1sen!2sua!4v1467199813192" width="600" height="450" seamless="seamless" style="border:0" allowfullscreen></iframe>

CSS

// оверлей, прозорий блок у CSS
.overlay {
	background:transparent; 
	position:relative; 
	width:100%;
	height:550px;
	top:650px;  // відрегулюйте ці значення під вашу верстку і висоту мапи
	margin-top:-650px;  // відрегулюйте ці значення під вашу верстку і висоту мапи
}

 jQuery

$(document).ready(function(){
	$('.overlay').click(function() {
		$(this).remove();
	});
});

Ось і весь нехитрий спосіб, чи вдалося вам вирішити проблему?

Скрипт виводить кількість днів, хвилин, секунд від 2011 року (1192060800000)

$(function(){
    var calcNewYear = setInterval(function(){
        date_future = 1192060800000;
        date_now = new Date();

        seconds = Math.floor((date_now - (date_future))/1000);
        minutes = Math.floor(seconds/60);
        hours = Math.floor(minutes/60);
        days = Math.floor(hours/24);
        
        hours = hours-(days*24);
        minutes = minutes+(days*24*60)+(hours*60);
        seconds = seconds+(days*24*60*60)+(hours*60*60)+(minutes*60);

        $("#time").text("Time until 2007:\nDays: " + days + " Hours: " + hours + " Minutes: " + minutes + " Seconds: " + seconds);
    },1000);
});

І висновок відбувається в блок html

Перше що потрібно зробити - встановити NPM і якщо він встановлений то сам Gulp

// Консоль: встановлюємо gulp глобально в системі
sudo npm install --global gulp

// Створюємо файл всередині нашого проекту з ім'ям package.json
{
  "name": "gulp-myprojectname",
  "version": "0.1.0",
  "devDependencies": {
  }
}

// Консоль: встановлюємо локально в директорію проекту
npm install --save-dev gulp

// Створюємо файл gulpfile.js у корені проекту з вмістом:
var rename = require('gulp-rename');
gulp.task('default', function () {
	// тут будуть завдання для нашого gulp файлу
});

// Додаємо в gulpfile.js перше завдання (об'єднання всіх css файлів в один)
// Заходимо сюди http://gulpjs.com/plugins/ і знаходимо плагін gulp-concat-css
// Встановлюємо плагін. Консоль: npm install --save-dev gulp-concat-css
// і в задачу Default додаємо
gulp.task('default', function () {
    // concatCSS - ім'я файлу для збереження
    // dest - папка в яку буде збережений файл
  return gulp.src('assets/**/*.css')
    .pipe(concatCss("styles/bundle.css"))
    .pipe(gulp.dest('out/'));
});

за аналогією і інші плагіни, я їх просто перерахую

https://www.npmjs.com/package/gulp-concat-css/
npm install --save-dev gulp-concat-css

https://www.npmjs.com/package/gulp-minify-css/
npm install --save-dev gulp-minify-css

npm install --save-dev gulp-rename

З книги про javascript :)

Щоб перевірити який браузер використовується, можна використовувати невеликий javascript

var isOpera = !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;
    // Opera 8.0+ (UA detection to detect Blink/v8-powered Opera)
var isFirefox = typeof InstallTrigger !== 'undefined';   // Firefox 1.0+
var isSafari = Object.prototype.toString.call(window.HTMLElement).indexOf('Constructor') > 0;
    // At least Safari 3+: "[object HTMLElementConstructor]"
var isChrome = !!window.chrome && !isOpera;              // Chrome 1+
var isIE = /*@cc_on!@*/false || !!document.documentMode;   // At least IE6

var output = 'Detecting browsers by ducktyping:<hr>';
output += 'isFirefox: ' + isFirefox + '<br>';
output += 'isChrome: ' + isChrome + '<br>';
output += 'isSafari: ' + isSafari + '<br>';
output += 'isOpera: ' + isOpera + '<br>';
output += 'isIE: ' + isIE + '<br>';
document.body.innerHTML = output;

Зробимо контейнер, який заліпає до верху сторінки, за прикладом бутстраповского nav:

<nav class="navbar navbar-default" role="navigation">
  <div class="container-fluid">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapse-main"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button>
      <a class="navbar-brand" href="#"></a> </div>
    <div class="collapse navbar-collapse" id="navbar-collapse-main">
      <ul class="nav navbar-nav navbar-right">
        <li><a href="javascript:void(0);">Home</a></li>
        <li><a href="javascript:void(0);"><a href="http://www.jqueryscript.net/menu/">Menu</a> Item #2</a></li>
        <li><a href="javascript:void(0);">Menu Item #3</a></li>
        <li><a href="javascript:void(0);">Menu Item #4</a></li>
        <li><a href="javascript:void(0);">Menu Item #5</a></li>
      </ul>
    </div>
  </div>
</nav>