2017-02-17 7 views
0

私のHTMLとCSSここ背景をクリックして別のサイトに移動しますか?

body { 
 
    background: url(main.gif) no-repeat center center fixed; 
 
    -webkit-background-size: cover; 
 
    -moz-background-size: cover; 
 
    -o-background-size: cover; 
 
    background-size: cover; 
 
    background-color: #000000; 
 
    width: 100%; 
 
    height: 100%; 
 
}
<!doctype html> 
 
<html> 
 

 
<head> 
 
    <meta charset="utf-8"> 
 
    <link rel="shortcut icon" type="image/png" href="fav.png" /> 
 
    <link href="style.css" rel="stylesheet" type="text/css"> 
 
    <title>@nosleep</title> 
 
</head> 
 

 
<body> 
 
</body> 
 

 
</html>

+0

ていますあなたが好きなようにイメージを表示するのに問題がある、またはクリックイベントを適用するのに役立つ必要がありますか? –

答えて

0

javascriptを避けるには、画面に表示される要素を追加します。

body { 
 
    background: hsl(0,0%,50%); 
 
} 
 
a#fill{ 
 
    position:fixed; 
 
    top:0; 
 
    left:0; 
 
    height:100vh; 
 
    width:100vw; 
 
    color: color:hsl(0,0%,80%); 
 
    text-align: center; 
 
    padding-top: 45vh; 
 
    transition: .3s background-color, .3s color; 
 
} 
 
a#fill:hover { 
 
    background-color: hsla(0,0%,0%,.3); 
 
    color: white; 
 
}
<a href="https://jsfiddle.net/" id="fill">click to visit jsfiddle</a>

あなたが好む場合はそう傾斜している場合、あなたはまた、プレーンなJavaScriptでこれを行うことができます:このような何か

document.addEventListener("DOMContentLoaded", function() { 
    document.getElementsByTagName('body')[0].addEventListener('click',function(){ 
    window.location = 'http://developer.mozilla.org'; 
    }); 
}); 

しかし、Y

0

私は、GIFの背景でサイトを作って、画面上の任意の場所をクリックした後、私は別のサイト(softlaunchのようなもの)に行きたい

あなたのクリックイベントを処理するコードです:

<script> 
    $(document).ready(function() { 
     $("body").on("click", function() { location.href = 'http://developer.mozilla.org'; }); 
    }); 
</script> 

希望彼の助けになる。

関連する問題