Změna obrázku přejetím na chování

Klady: něco nového ve vašem portfoliu, můžete případ „oživit“

Nevýhody: zatím se nám podařilo vytvořit funkční verzi pouze pro desktop.

(PS Pokud víte, jak to udělat pro mobilní zařízení, napište do komentářů, budu vám vděčný🙏🏻)

Pozadí

V létě jsem absolvoval kurz kompozic z oblasti vědy o designu a rozhodl jsem se práci nějak zařídit. Pak jsem si myslel, že samotné vytváření kousků rámů by bylo nudné a nepochopitelné, chtěl jsem přidat interaktivitu, takže obrázek byl změněn pomocí kurzoru a rozložení.

Přesunutí

Udělal jsem rozložení v codepenu se samotné umístění kurzoru provádí v několika řádcích v CSS:

Vložit na chování

Když je vše připraveno, stiskněte tlačítko v emblému kódového okna „. V okně nastavení vyberte motiv (motiv lze nakonfigurovat v rozšířené verzi tak, aby pole nebyla viditelná), pak musíte zajistit, aby byl stisknut pouze „Výsledek“, poté vyberte „iframe“ a vše zkopírovat níže.

Nyní zbývá pouze vložka .

Behance má také tlačítko „Vložit“, klikněte a vložte. Dále budete s největší pravděpodobností muset upravit výšku na požadovanou velikost.

Hotovo. A výsledek lze vidět zde 🙂

Pracovní postup složení Pracovní postup složení www.behance.net

Máte zájem o podobný design?

Další práce

Objednávka designu

Naše portfolio obsahuje stovky projektů: interiérový design, webové stránky, reklamní kampaně, loga, corporate identity. Každý úkol řešíme smysluplně, elegantně a krásně.

Abychom mohli začít, musíme si promluvit. Stačí něco říct o vašem projektu, nechat kontakty a my Vás budeme kontaktovat, abychom vše probrali.