Autor Zpráva
Denisa
Profil
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
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
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
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
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
Denisa:
Místo right použiješ left.
jefitto44
Profil
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>

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: