2016-12-11 5 views
0

この単純なアプリケーションをスクロールに表示するには、css、js、およびhtmlを記述しましたが、それでもhtmlでは実行できません。たぶんそれは私のhtmlでそれを接続している方法ですが、それはうまくいくように私はそれが正しいことを確認するために多くのサイトを探して...私は間違っているか分からない。divでスクロールして表示されます。

CSS:

.aboutfilmandcrew { 
    width: 100%; 
    float: left; 
    background-color: green; 
} 
#filminfo{ 
    padding:1em; 
    border:.1em solid rgb(230, 230, 230); 
    margin: 2em; 
    width: 40%; 
    float: left;  
} 
#crew{ 
    padding:1em; 
    border:.1em solid rgb(230, 230, 230); 
    margin: 2em; 
    width: 40%; 
    float: right; 
} 

HTML:

<div> 
    <div id="filminfo"> Neuromancer, a novel written by William Gibson in 1984, takes place in the near future in a cyberpunk setting. Cyberpunk is a genre that focuses on future societies where technology has advanced, but crime and corruption have as well. Common features include globe-spanning mega-corporations, cybernetically enhanced mercenaries, and the importance of technology as a tool for crime. The story follows the experiences of Case, an out-of-work hacker who is contacted by a mysterious new employer called Armitage. Along with Molly, a mercenary cyborg, and a thief/illusionist named Peter Riviera, Case participates in a series of data thefts for their employer. Based on the novel, and helmed by master director Ridley Scott, NEUROMANCER features a star studded cast that includes Ryan Gosling, Lucy Liu, Hayden Christensen and Benedict Cumberbatch. 
     <br/> 
     <h4> GENRES </h4> <p>Sci fi/Adventure </p> 
    </div> 
    <!---aboutfilm--> 
    <div id="crew"> 
     <p>Director Ridley Scott </p> 
     <p> Screenplay by Drew Goddard </p> 
     <p> Based on the Novel By William Gibson </p> 
     <p> Producers Simon Kinberg, Ridley Scott, Michael Schaefer, Aditya Sood, Mark Huffam </p> 
     <p> Actors Ryan Gosling, Lucy Liu, Hayden Christensen and Benedict Cumberbatch </p> 
    </div> 
</div> 
<!---crew--> 
<!---aboutfilmandcrew--> 

JS:

$(document).scroll(function() { 
    var y = $(this).scrollTop(); 

    if (y > 200) { 
    $('.aboutfilmandcrew').fadeIn(); 
    } else { 
    console.log("<"); 
    $('.aboutfilmandcrew').fadeOut(); 
    } 
});` 

答えて

0

$(function(){ 
 
    $(".aboutfilmandcrew").hide(); 
 
    }); 
 
$(document).scroll(function() { 
 
    var y = $(this).scrollTop(); 
 
    if (y > 200) { 
 
     $('.aboutfilmandcrew').fadeIn(); 
 
    } 
 
    else { 
 
     $('.aboutfilmandcrew').fadeOut(); 
 
    } 
 
});
.aboutfilmandcrew { 
 
    width: 100%; 
 
    float: left; 
 
    background-color: green; 
 
} 
 

 
#filminfo { 
 
    padding: 1em; 
 
    border: .1em solid rgb(230, 230, 230); 
 
    margin: 2em; 
 
    width: 40%; 
 
    float: left; 
 
} 
 

 
#crew { 
 
    padding: 1em; 
 
    border: .1em solid rgb(230, 230, 230); 
 
    margin: 2em; 
 
    width: 40%; 
 
    float: right; 
 
} 
 

 
body { 
 
    height: 1600px; 
 
}
<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <link rel="stylesheet" href="mycss.css" type="text/css"> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
 
    <script src="script.js"></script> 
 
</head> 
 

 
<body> 
 
    <div class="aboutfilmandcrew"> 
 
     <div id="filminfo"> Neuromancer, a novel written by William Gibson in 1984, takes place in the near future in a cyberpunk setting. Cyberpunk is a genre that focuses on future societies where technology has advanced, but crime and corruption have as well. Common features include globe-spanning mega-corporations, cybernetically enhanced mercenaries, and the importance of technology as a tool for crime. The story follows the experiences of Case, an out-of-work hacker who is contacted by a mysterious new employer called Armitage. Along with Molly, a mercenary cyborg, and a thief/illusionist named Peter Riviera, Case participates in a series of data thefts for their employer. Based on the novel, and helmed by master director Ridley Scott, NEUROMANCER features a star studded cast that includes Ryan Gosling, Lucy Liu, Hayden Christensen and Benedict Cumberbatch. 
 
      <br/> 
 
      <h4> GENRES </h4> 
 
      <p> Sci fi/Adventure </p> 
 
     </div> 
 
     <!---aboutfilm--> 
 
     <div id="crew"> 
 
      <p>Director Ridley Scott </p> 
 
      <p> Screenplay by Drew Goddard </p> 
 
      <p> Based on the Novel By William Gibson </p> 
 
      <p> Producers Simon Kinberg, Ridley Scott, Michael Schaefer, Aditya Sood, Mark Huffam </p> 
 
      <p> Actors Ryan Gosling, Lucy Liu, Hayden Christensen and Benedict Cumberbatch </p> 
 
     </div> 
 
     <!---crew--> 
 
    </div> 
 
</body> 
 

 
</html>

あなたが開かれたことがありませんSci fi/Adventure</p>があります。このエラーを簡単に修正できるように、開始<p>を追加してください。

編集:あなたがコメントしたことをしたいのであれば、CSSのボディに特定のサイズを設定する必要があります。

body{ 
    height:1000px; 
} 
0

私によれば、あなたのコードは必要に応じて機能しています。

$(document).scroll(function() { 
 
    var y = $(this).scrollTop(); 
 
    if (y > 200) { 
 
     $('.aboutfilmandcrew').fadeIn(); 
 
    } else { 
 
     $('.aboutfilmandcrew').fadeOut(); 
 
    } 
 
});
.aboutfilmandcrew { 
 
    width: 100%; 
 
    float: left; 
 
    background-color: green; 
 
} 
 
#filminfo { 
 
    padding: 1em; 
 
    border: .1em solid rgb(230, 230, 230); 
 
    margin: 2em; 
 
    width: 40%; 
 
    float: left;  
 
} 
 
#crew { 
 
    padding: 1em; 
 
    border: .1em solid rgb(230, 230, 230); 
 
    margin: 2em; 
 
    width: 40%; 
 
    float: right; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="aboutfilmandcrew"> 
 
    <p id="filminfo"> 
 
    Neuromancer, a novel written by William Gibson in 1984, takes place in the near future in a cyberpunk setting. Cyberpunk is a genre that focuses on future societies where technology has advanced, but crime and corruption have as well. Common features include globe-spanning mega-corporations, cybernetically enhanced mercenaries, and the importance of technology as a tool for crime. 
 
    The story follows the experiences of Case, an out-of-work hacker who is contacted by a mysterious new employer called Armitage. Along with Molly, a mercenary cyborg, and a thief/illusionist named Peter Riviera, Case participates in a series of data thefts for their employer. Based on the novel, and helmed by master director Ridley Scott, NEUROMANCER features a star studded cast that includes Ryan Gosling, Lucy Liu, Hayden Christensen and Benedict Cumberbatch. 
 
    <h4>GENRES</h4> 
 
    Sci fi/Adventure 
 
    </p> 
 
</div> 
 

 
<div id="crew"> 
 
    <p>Director Ridley Scott </p> 
 
    <p> Screenplay by Drew Goddard </p> 
 
    <p> Based on the Novel By William Gibson </p> 
 
    <p> Producers Simon Kinberg, Ridley Scott, Michael Schaefer, Aditya Sood, Mark Huffam </p> 
 
    <p> Actors Ryan Gosling, Lucy Liu, Hayden Christensen and Benedict Cumberbatch </p> 
 
</div>

+0

ない何私は、テキストとのdivが負荷に消えると、私はスクロールダウンしたときに表示されるようにしたいですか? –

+0

@JasonMerrigan最新の回答を確認してください。 –

関連する問題