| Autor | Zpráva | ||
|---|---|---|---|
| Denisa Profil |
#1 · Zasláno: 19. 2. 2014, 22:02:34
Ahoj,
můžete mi prosím poradit, jak vytvořím takovou tu šipku, která se zobrazuje na stránce když scrollujete dolů a když na ní kliknete, tak Vás to hodí nahoru na stránku? Děkuju! D. |
||
| jefitto44 Profil |
Na vrchu stránky si definuješ
<a name="hore"></a> A potom na spodku stránky <a href="#hore">HORE</a> Oficiálne sa to volá: Záložky |
||
| Denisa Profil |
#3 · Zasláno: 19. 2. 2014, 22:27:14
Jojo, to umím :) Ale já potřebuju šipku, která cestuje neustále tobě na očích a kdykoliv můžeš díky ní vyjet nahoru. Například k vidění zde, když kousek sjedeš tak vyjede vpravo dole u lišty. http://www.ebay.com/sch/i.html?_odkw=t-shirt&_osacat=0&_from=R40&_trksid=p2045573.m570.l1313&_nkw=t-shirt+fox&_sacat=0
|
||
| jefitto44 Profil |
#4 · Zasláno: 19. 2. 2014, 22:32:04
Dá sa použiť obrázok ako odkaz na name, ktorý bude v CSS nastylovaný nejako takto:
.hore a img {
position: fixed;
background: blablabla;
right: 0;
bottom: 20px;
}Treba samozrejme prispôsobiť tvojim potrebám, vzdialenosť od pravej a dolnej strany je lepšia za predpokladu, že to chceš mať vpravo dole. Position: fixed zabezpečí, že odkaz nebude rolovať so stránkou |
||
| juriad Profil |
#5 · Zasláno: 19. 2. 2014, 22:34:28
Vždy viditelnou šipku můžeš udělat pomocí css:
{
position: fixed;
bottom: 80px;
right: 0px;
}To, aby se šipka zobrazila jen při odscrollování, musíš vyřešit JavaScriptem: detekovat, jak moc je stránka odscrollovaná, a pokud to překročí nějakou mez, nasatvit šipce display: block. Efekt můžeš udělat postupným zvětšováním vlastnosti rigth (začneš s -20 a skončíš po sekundě s 0).
|
||
| Denisa Profil |
#6 · Zasláno: 19. 2. 2014, 22:59:12
A jde nějak nastavit, aby vždy byla připnutá k levé straně stránky, ať člověk používá kterékoliv rozlišení? Je na to nějaká vlastnost? Díky Vám moc!
|
||
| juriad Profil |
#7 · Zasláno: 19. 2. 2014, 23:03:59
Denisa:
Místo right použiješ left. |
||
| jefitto44 Profil |
#8 · Zasláno: 20. 2. 2014, 06:58:38 · Upravil/a: jefitto44
Petr ZZZ:
„jefitto44, máš v kódu [#2] chybu, oprav si ji prosím (pak se odtud smažu).“ Opravené .sipka a img {
position: fixed;
left: 0;
bottom: 60px;
display:block;
}A html V hornej časti stránky <a name="hore"></a> <div class="sipka"> <a href="#hore"><img src="img/top.png" alt=""></a> </div> |
||
|
Časová prodleva: 12 let
|
|||
0