• 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)

VPS Starter Arubacloud
–1 głos
321 wizyt
pytanie zadane 9 sierpnia 2018 w HTML i CSS przez DariuszH Gaduła (3,100 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 2018 przez shotokan Nałogowiec (39,660 p.)
Nie widzę elementu div w Twoim kodzie.
komentarz 9 sierpnia 2018 przez DariuszH Gaduła (3,100 p.)
Czy jest czy go nie ma. Wszystkiego próbowałem i nic :)
komentarz 9 sierpnia 2018 przez ScriptyChris Mędrzec (190,190 p.)

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

komentarz 10 sierpnia 2018 przez DariuszH Gaduła (3,100 p.)
Chcę żeby pozycja napisu się nie zmieniała. tzn litera t nie wychodziła poza obręb pola przeglądarki
komentarz 10 sierpnia 2018 przez DariuszH Gaduła (3,100 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ź 1,363 wizyt
pytanie zadane 26 października 2016 w JavaScript przez Kikaczo Początkujący (280 p.)
0 głosów
2 odpowiedzi 190 wizyt
+1 głos
1 odpowiedź 204 wizyt
pytanie zadane 18 kwietnia 2019 w JavaScript przez Kubs Mądrala (5,190 p.)

92,452 zapytań

141,262 odpowiedzi

319,077 komentarzy

61,854 pasjonatów

Motyw:

Akcja Pajacyk

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

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...