izanic/SAE_WEB_S1
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

différente page

Browse Source
This commit is contained in:
Hugo IZANIC 2024-01-03 20:41:13 +01:00
parent 7f9cfabcf5
commit 7fbda296e9
2 changed files with 18 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
CSS/styles.css
View File

@ -98,6 +98,7 @@ nav li{
.page p{
margin-right: 10vh;
color: white;
transition: color linear 0.7s;
}
@ -106,6 +107,7 @@ nav li{
transform: scale(1.3,1.3);
transition: transform cubic-bezier(0,0.6,0.4,1.03) 1s;
}
.page p:not(:hover){transition: color linear 0.7s;transition: transform ease 0.4s ;}
@ -189,7 +191,7 @@ main p{
filter: saturate(0.2);
}
#img_gauche_txt_droite p:hover + .img_main,#img_droite_txt_gauche p:hover + .img_main,.img_main:hover{
#hover_img_1:hover + .img_main,#hover_img_2:hover + .img_main,.img_main:hover{
box-shadow: 0 40px 60px rgba(150,0,0,0.7);
transform: scale(1.3,1.3);
transition: transform ease 0.8s;
@ -197,8 +199,20 @@ main p{
}
#hover_img_1{
top: 15vh;
position: absolute;
height: 35vh;
width: 100vw;
}
#hover_img_2{
top: 50vh;
position: absolute;
height: 35vh;
width: 100vw;
}

6
index.html
View File

@ -40,16 +40,16 @@
<a href="#"><img id="btn_up" src="img/icone/arrow-up.svg" alt="icone de fleche"></a>
<div id="img_gauche_txt_droite">
<p>
ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
</p>
<div id="hover_img_1"> </div>
<img class="img_main" src="img/casion_background.jpeg">
</div>
<div id="img_droite_txt_gauche">
<p>
@ -58,7 +58,7 @@
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
</p>
<div id="hover_img_2"> </div>
<img class="img_main" src="img/casion_background.jpeg">