CSS hover efekt na input submit – obrázek problikne

26. 1. 2013 11:19:10

Ahoj,

chtěl bych poprosit o radu, jak se vypořádat s následujícím problémem. Na input submit button jsem aplikoval efekt změny pozadí při najetí myší. Vše pracuje v pořádku, akorát při prvním načtením stránky a následném najetí myši na tlačítko, obrázek "přeblikne". Po opětovném najetí (bez reloadu) myší na tlačítko již změna proběhne plynule.

kód CSS:

HTML

Velikost obou obrázků je 7 kB

Nevíte jak se tohoto prvotního probliknutí zbavit? Na pomalejším internetu je tato situace opravdu strašná.

Předem moc díky za reakce

Kuzmic

26. 1. 2013 11:19:10

https://webtrh.cz/diskuse/css-hover-efekt-na-input-submit-obrazek-problikne#reply857895

Ondřej Švec

26. 1. 2013 11:20:50

Ahoj, použij techniku "css sprites".

Obrázky se zkombinují do jednoho a potom se jenom posouvají (tzn. jsou přednačtené a žádné "probliknutí" nenastane)

26. 1. 2013 11:20:50

https://webtrh.cz/diskuse/css-hover-efekt-na-input-submit-obrazek-problikne#reply857894

Miloslav Lešetický

(10 hodnocení)

26. 1. 2013 11:21:36

Vyrobíš si oba stavy jako jeden obrázek, a při hoveru měníš jen pozici. Viz ukázka a vysvětlení: http://wellstyled.com/css-nopreload-rollovers.html

26. 1. 2013 11:21:36

https://webtrh.cz/diskuse/css-hover-efekt-na-input-submit-obrazek-problikne#reply857893

Lukáš Jurygáček

(26 hodnocení)

26. 1. 2013 11:35:44

Ano, sprite je nejlepší způsob, jinak si můžeš obrázek s hover efektem vložit až před a dáš mu display: none

26. 1. 2013 11:35:44

https://webtrh.cz/diskuse/css-hover-efekt-na-input-submit-obrazek-problikne#reply857892

Ondřej Krobot

(50 hodnocení)

26. 1. 2013 12:48:56

Moc díky! Pomohlo to posunutí pozadí.

26. 1. 2013 12:48:56

https://webtrh.cz/diskuse/css-hover-efekt-na-input-submit-obrazek-problikne#reply857891

Pro odpověď se přihlašte.

Přihlásit

Prodej Více

starcom.cz – Cena možná i dohodou.

20 000 Kč

0 příhozů

Zastavarna.cz

96 999 Kč

0 příhozů

Prodám e-shop DreveneHodinky.eu a DreveneHodinky.sk

5 900 Kč

0 příhozů

⭐ Největší česká GASTROMAPA ⭐

9 900 Kč

0 příhozů

10 let stará doména vč. microsite Aspall.cz

3 500 Kč

0 příhozů

Poptávky Více

🤝 Hledám partnera pro zprostředkování klientů ke správě nemovitostí

Grafický návrh webu zaměřeného na sdílení elektřiny.

Plnění Eshopu

Poptávka frontend kapacit

Rychlý test přes TV prohlížeč, TV 2019 a starší

Pracovní nabídky Více

Hledáme 2 zkušené vývojáře

Práce z domu, Praha

Fullstack Dev Java/React

Nabídky Více

🏡 Virtuální asistentka pro realitní investory

🎄 Připravte své kampaně na VÁNOCE – ✅ Maximalizace konverzí a ziskovosti – ✨ PPC specialista – 16 let praxe 🔥

OpenServis – rychlá tvorba e-shopu do 5 prac. dní – PrestaShop

🔶 Linkbuilding a SEO co REÁLNĚ zvyšují organickou návštěvnost od Linkbuilder.cz 🔶

📌 REGISTRÁTORKA.CZ – Profesionální registrace do katalogů