したがって、CSSで:hoverエフェクトを使用して別のdivの要素を変更しようとしています。CSS別のdivの要素を変更するにはdivに移動します
私のコードをチェックすれば、私が達成しようとしていることを理解する必要があります。
あなたは私がテキストのプロジェクト」を持つようにスライダーコンテナが好きなので、上のボタン
のすべてのためになり、プロジェクトのボタンの上に置くと、私はボタンがどのスライダーコンテナの前にする必要があることを理解しそれは、私は本当になぜこれが動作していないのか分からないのですか?
誰かがこのホバー効果の使用に関するより良いチュートリアルを指示することができ、私が本当に感謝している問題を理解するのを手伝ってもらえますか。
ありがとうございました! :)
#content {
position: relative; \t
overflow: hidden;
width: 900px;
height: 440px;
background: #D5D5D5; \t
margin: auto;
top: 50px; left: 0; bottom: 0; right: 0; \t
-webkit-box-shadow: 0px 0px 23px 3px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 23px 3px rgba(0,0,0,0.75);
box-shadow: 0px 0px 23px 3px rgba(0,0,0,0.75);
}
.logo-container{
display: flex;
flex-direction: row;
position: relative;
width: 100%;
height: 100px;
justify-content: center;
margin: auto;
float: right;
top: 0px;
}
.blockicon {
position: relative;
width: 50px;
height: 50px; \t
top: 15px;
border-radius: 50%;
border: solid 5px black;
cursor: pointer;
font-size: 30px;
text-align: center;
vertical-align: middle;
line-height: 50px;
margin: 0 0.8%;
}
.projects {
background: #801113;
}
.projects:hover > \t .slider-container {
background: #801113;
}
.projects:hover > \t .slider-container:before {
content:"Projects";
}
.aboutme {
background: #1A8305;
}
.aboutme:hover > \t .slider-container {
background: #1A8305;
}
.aboutme:hover > \t .slider-container:before {
content:"About Me";
}
.contactme {
background: #E8BA1A; \t \t \t
}
.contactme:hover > \t .slider-container {
background: #E8BA1A;
}
.contactme:hover > \t .slider-container:before {
content:"Contact Me";
}
.helped {
background: #0049BB;
}
.helped:hover > \t .slider-container {
background: #0049BB;
}
.helped:hover > \t .slider-container:before {
content:"Helped";
}
.hobbys {
background: #A40CA3; \t
}
.hobbys:hover > .slider-container {
background: #A40CA3;
}
.hobbys:hover > \t .slider-container:before {
content:"Hobbys";
}
.slider-container {
position:absolute;
background: #CF4000;
width: 95%;
height: 320px;
margin: auto;
top: 400px; left: 0; bottom: 0; right: 0;
}
.slider-container:before {
position:absolute;
content:"Test";
font-size: 30px;
bottom: 20%;
left: 40%;
font-family: Aldrich;
padding: 0;
font-weight: bold;
color: white;
z-index: 999;
}
@media screen and (max-width: 900px) {
#content {
width: 100%;
}
#content-container {
width: 100%; \t
}
#footer {
width: 100%; \t
}
}
<div id="content">
<div class="logo-container">
<div class="blockicon projects"> P </div>
<div class="blockicon aboutme"> A </div>
<div class="blockicon contactme"> C </div>
<div class="blockicon helped"> H </div>
<div class="blockicon hobbys"> H </div>
<div class="slider-container">
</div>
</div>
</div>
http://stackoverflow.com/questions/4502633/how-to-affect-other-elements-あなたがここであなたの答えを見つけるだろうと思うときに: – Maharkus