• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Jak ustalić element div, by był w tym samym miejscu po wcisnięciu f11(ekran pełny)

Konferencja JOIN! 2018
–1 głos
70 wizyt
pytanie zadane 9 sierpnia w HTML i CSS przez DariuszH Gaduła (3,070 p.)
<!Doctype html>
<head>
<meta charset="utf-8">
<link href="https://fonts.googleapis.com/css?family=Baloo+Paaji|Bowlby+One+SC|Overpass+Mono" rel="stylesheet"> 
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>

    
   <span id="javascript"> 
        <span id="j">J</span>
        <span id="a1">a</span>
        <span id="v">v</span>
        <span id="a2">a</span>
        <span id="s">s</span>
        <span id="c">c</span>
        <span id="r">r</span>
        <span id="i">i</span>
        <span id="p">p</span>
        <span id="t">t</span>
    </span>
<br>

<span id="kurs"> kurs</span> 

</body>
<html>

body{
background-color: rgb(73, 201, 252);
overflow: hidden;

}

#javascript{
height: 20vh;
position:relative;
left:54%;
top:66vh;
font-family: 'Overpass Mono', monospace;
font-family: 'Bowlby One SC', cursive;
font-family: 'Baloo Paaji', cursive;
font-size:15vh;
color:white;
letter-spacing: -1vh;
text-shadow: 2px 3px 4px black;
}


#kurs{

position:absolute;
right:-150%;
font-family: 'Overpass Mono', monospace;
font-family: 'Bowlby One SC', cursive;
font-family: 'Baloo Paaji', cursive;
font-size:9vh;
color:white;
letter-spacing: 1vh;
text-shadow: 2px 3px 4px black;
animation:1s kurs forwards;
animation-delay: 0.3s;
z-index: 2;
}
@keyframes kurs{
from{right:-150%;}
to{right:38%;top:60vh;}



}







#j{
animation:0.8s from_up forwards;
top:0vh;
position:relative;
left: 1%
}

@keyframes from_up{

from{top:-90vh;left:-130vh;}
to{top:0vh;left:0vh;}
}

#a1{
animation:0.8s a1 forwards;
top:0vh;
position: relative;
left:0%;



}

@keyframes a1{

from{top:70vh; left:-38vh;}
to{top:0vh;}
}




#v{
animation:0.8s v forwards;
top:0vh;
position:relative;
left:0%;
}

@keyframes v{

from{top:220vh;left:50vh;}
to{top:0vh;}
}

#a2{
animation:0.8s a2 forwards;
top:0vh;
position:relative;
left:0%;
}

@keyframes a2{

from{top:-80vh;left:-12vh;}
to{top:0vh;}
}

#s{
animation:0.7s s forwards;
top:0vh;
position:relative;
left:0%;
}

@keyframes s{

from{top:150vh;left:-37vh;}
to{top:0vh;}
}

#c{
animation:0.81s c forwards;
top:0vh;
position:relative;
left:0%;
}

@keyframes c{

from{top:140vh; left:140vh;}
to{top:0vh;}
}

#r{
animation:0.61s r forwards;
top:0vh;
position:relative;
left:0%;
}

@keyframes r{

from{top:150vh;left:-190vh;}
to{top:0vh;}
}
#i{
animation:0.8s i forwards;
top:0vh;
position:relative;
left:0%;
}

@keyframes i{

from{top:-60vh;left:130vh;}
to{top:0vh;}
}

#p{
animation:0.8s p forwards;
top:0vh;
position:relative;
left:0%;
}

@keyframes p{

from{top:100vh;left:200vh;}
to{top:0vh;}
}

#t{
animation:0.8s t forwards;
top:0vh;
position:relative;
left:0%;
}

@keyframes t{

from{top:0vh;left:600vh;}
to{top:0vh;}
}

</style>

 

komentarz 9 sierpnia przez shotokan Nałogowiec (35,560 p.)
Nie widzę elementu div w Twoim kodzie.
komentarz 9 sierpnia przez DariuszH Gaduła (3,070 p.)
Czy jest czy go nie ma. Wszystkiego próbowałem i nic :)
komentarz 9 sierpnia przez JSHolic Maniak (74,210 p.)

@DariuszH, doprecyzuj pytanie. Chcesz znać pozycję elementu względem ekranu po przejściu w tryb pełnego ekranu?

komentarz 10 sierpnia przez DariuszH Gaduła (3,070 p.)
Chcę żeby pozycja napisu się nie zmieniała. tzn litera t nie wychodziła poza obręb pola przeglądarki
komentarz 10 sierpnia przez DariuszH Gaduła (3,070 p.)
Może dojdę do tego. Jak się przyjrzeć dobrze, to napis proporcjonalnie zwiększa swoje rozmiary. Może jakiś atrybut css który pozostawi wielkość liter taką samą jak w podstawowym widoku.

Zaloguj lub zarejestruj się, aby odpowiedzieć na to pytanie.

Podobne pytania

0 głosów
1 odpowiedź 182 wizyt
pytanie zadane 26 października 2016 w JavaScript, jQuery, AJAX przez Kikaczo Początkujący (280 p.)
0 głosów
2 odpowiedzi 92 wizyt
0 głosów
2 odpowiedzi 106 wizyt
Porady nie od parady
Wynikowy wygląd pytania, odpowiedzi czy komentarza, różni się od tego zaprezentowanego w edytorze postów. Stosuj więc funkcję Podgląd posta znajdującą się pod edytorem, aby upewnić się, czy na pewno ostateczny rezultat ci odpowiada.Podgląd posta

55,375 zapytań

99,731 odpowiedzi

205,203 komentarzy

27,301 pasjonatów

Przeglądających: 273
Pasjonatów: 10 Gości: 263

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto dwie polecane książki warte uwagi. Pełną listę znajdziesz tutaj.

...