NOVINKA - Online rekvalifikační kurz Java programátor. Oblíbená a studenty ověřená rekvalifikace - nyní i online.
NOVINKA – Víkendový online kurz Software tester, který tě posune dál. Zjisti, jak na to!
Avatar
Gabriel Konečný
Člen
Avatar
Gabriel Konečný:28.7.2016 11:17

Cau,

Chcel by urobit miniatúru webovej stránky, ktorá sa bude scrollovat súcasne s webovou stránkou. Jej miniatúra bude umiestnená v obrázku smartphonu, tabletu a PC. (vid prilozene obrázky)

CSS:

.parallax{

    background-image: url(parallaxb.jpg);

    position: absolute;
    margin-top: 250px;
    left: 500px;


    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: top;
    background-repeat: no-repeat;
    background-size: 20%;

    height: 167.5px;
    width: 100%;
    }

.pc{
   padding-left: 408px;
   padding-top: 182px;
   width: 521px;
   height: 368px;

}

Je tam pár problémov:

  1. Obrázok stránky sa scrolluje naopak
  2. Obrázok zacína niekde v strede
  3. Rýchlost scrollovania je prílis pomalá

Vie mi s tým niekto pomoct?

Vopred dakujem.

 
Odpovědět
28.7.2016 11:17
Avatar
David Hynek
Tvůrce
Avatar
Odpovídá na Gabriel Konečný
David Hynek:28.7.2016 11:46

čas pro javascript :)

můžeš pak nastavit, že rolování pozadí bude x-krát rychlejší nebo pomalejší než samotné rolování stránky a pod. Ale spíš bych použil pomalejší, protože by pak mohl obrázek pozadí dojít...

Editováno 28.7.2016 11:48
Nahoru Odpovědět
28.7.2016 11:46
Čím víc vím, tím víc věcí nevím.
Avatar
Gabriel Konečný
Člen
Avatar
Odpovídá na David Hynek
Gabriel Konečný:28.7.2016 13:57

Nevies o nejakej stranke kde to je lepsie vysvetlene, resp nejaky tutorial na tento javascript?

Dakujem

 
Nahoru Odpovědět
28.7.2016 13:57
Avatar
David Hynek
Tvůrce
Avatar
Odpovídá na Gabriel Konečný
David Hynek:28.7.2016 15:43

co třeba první odkaz, při googlení :) http://pixelcog.github.io/parallax.js/
ale na rovinu řeknu že jquery nemám rád. Je to kanon na vrabce, člověk nikdy nevyužije celou knihovnu a těch pár efektů co by se člověku hodilo, zabere pár řádků prostého javascriptu... třeba tady http://inner.geek.nz/…pt/parallax/

Nahoru Odpovědět
28.7.2016 15:43
Čím víc vím, tím víc věcí nevím.
Avatar
Gabriel Konečný
Člen
Avatar
Gabriel Konečný:28.7.2016 17:44

Problem je ze ja potrebujem 3x scrolling effekt do kazdeho obrazku (vid nizsie wireframe)

Vsade najdem len ako to robia na cely background tj. cover.
Ako nahle to chcem zmensit tak to robi problemy, neni to cele, nezacina to od zaciatku a tak..

 
Nahoru Odpovědět
28.7.2016 17:44
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 5 zpráv z 5.