Щелкните по любой ссылке

У меня есть страница всплеска и вы хотите, чтобы пользователь мог щелкнуть в любом месте страницы и отправить их на главный сайт. Я нашел тесные решения на SO, но моя проблема в том, что моя всплывающая страница имеет плавающий div в центре, поэтому использование чего-то типа <body onclick="window.location.href='url'"> работает только при нажатии на div, а не где-либо еще на заднем плане. Вот HTML:Щелкните по любой ссылке

<html> 
<head> 
<link rel="stylesheet" href="styles/layout.css" type="text/css" /> 
</head> 
<body> 
    <div class="splash"> 
     <h1>PM & ASSOCIATES</h1> 
     <p>Worldwide</p> 
    </div> 
</body> 
</html>

И CSS:

.splash{ 
    position: absolute; 
    top: 50%; 
    left: 50%; 
    -moz-transform: translateX(-50%) translateY(-50%); 
    -webkit-transform: translateX(-50%) translateY(-50%); 
    transform: translateX(-50%) translateY(-50%); 
} 
.splash p{ 
    font-size:12pt; 
    font-family:Castellar, Garamond, "Times New Roman", Times, serif; 
} 
.splash h1{ 
    font-size:32pt; 
    font-family:Castellar, Garamond, "Times New Roman", Times, serif; 
}

источник

2014-11-13 uberchemist

Почему вы просто не сделать ширину тела и высоту 100%? – Huangism

Я никогда не знал, что теги html и body не по умолчанию не превышают 100% ширины/высоты. Урок выучен. – uberchemist

По крайней мере, исторически, у меня были подобные проблемы, пытаясь получить содержание занять высоту 100%, потому что body только как div. Он занимает только пространство, необходимое для его содержимого. Таким образом, чтобы исправить это, вы должны быть в состоянии сделать свой HTML и тело как 100%:

html { width:100%;height:100%; } 
body { width:100%;height:100%; }

Делать это должно заставить тело тега, чтобы занять все окно.

источник

2014-11-13 20:07:11

Спасибо, Кевин. Это было самое простое решение для реализации, хотя предложения всех остальных, вероятно, будут работать так же хорошо. – uberchemist

Это довольно простое решение, но это может работать, если вы в состоянии изменить HTML:

<html> 
    <head> 
     <link rel="stylesheet" href="styles/layout.css" type="text/css" /> 
    </head> 
    <body> 
     <div class="splash"> 
      <h1>PM & ASSOCIATES</h1><p>Worldwide</p> 
     </div> 
     <a href="[insert url here]" class="fullPageLink"></a> 
    </body> 
</html>

Вставьте нужный URL внутри HREF атрибута Линка.

Затем эти стили должны быть добавлены:

body{ 
    position: relative; 
    width: 100%; 
    height: 100%; 
} 
.fullPageLink{ 
    position: absolute; 
    display: block; 
    z-index: 10; 
    width: 100%; 
    height: 100%; 
}

источник

2014-11-13 20:07:24 Joe

Вы и Кевин придумали практически то же самое решение почти одновременно. Должен дать это Кевину за то, что он стал быстрее и проще, но, тем не менее, добрым усилием! – uberchemist

Щелкните по любой ссылке

ответ

Смежные вопросы