Diskuze: Přehrátí video

V předchozím kvízu, Online test znalostí JavaScript, jsme si ověřili nabyté zkušenosti z kurzu.

Aktivity

Amomym

Člen

Amomym:24.5.2013 20:24

Ahoj, dělám web a teď tam potřebuji použít javascript, který neumím , tak se ptám zde. Mám představu, že po kliknutí na obrázek, vyjede okno, kde by bylo nějaké video. Budu rád za každou pomoc, i kdyby to nebyl script, stačilo by aj co k tomu použít a třeba odkázat na nějaký článek tady na devbooku .

Odpovědět

24.5.2013 20:24

Amomym

Člen

Amomym:24.5.2013 21:36

???

Nahoru Odpovědět

24.5.2013 21:36

niveses

Tvůrce

niveses:24.5.2013 21:37

Foto udělej jako odkaz a pak: http://www.no-margin-for-errors.com/…htbox-clone/#…

Nahoru Odpovědět

24.5.2013 21:37

Michael Olšavský

Tvůrce

Michael Olšavský:24.5.2013 21:38

Co si predstavujes pod oknem?

Nahoru Odpovědět

24.5.2013 21:38

Amomym

Člen

Amomym:24.5.2013 21:41

tak dám příklad, jak jsou obrázky a když se klikne na nějaký, tak se otevřena velký, ale když se klikne mimo, tak se zavře, a toto bych chtěl s tím videem

Nahoru Odpovědět

24.5.2013 21:41

Michal Žůrek - misaz

Tvůrce

Michal Žůrek - misaz:24.5.2013 21:46

myslíš lightBox?

Editováno 24.5.2013 21:46

Nahoru Odpovědět

24.5.2013 21:46

Michal Žůrek - misaz

Tvůrce

Michal Žůrek - misaz:24.5.2013 21:47

Podívej se na web který dělám: http://ambrozici.unas.cz/fotogalerie/#vid3

Nahoru Odpovědět

24.5.2013 21:47

Amomym

Člen

Amomym:24.5.2013 21:50

ano, toto myslím

Nahoru Odpovědět

24.5.2013 21:50

Michal Žůrek - misaz

Tvůrce

Michal Žůrek - misaz:24.5.2013 21:52

Pokud myslíš to co jsem ti ukazoval na ambrožíkách, tak to dělám jednoduše přes css:

.lightBox {
    position: absolute;
    text-align: center;
    z-index: 5;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: rgba(0,0,0,0.85);
    display: none;
}

.lightBox:target {
    display: block;
}

a v kódu HTML je něco takoého:

<div id="vid3" class="lightBox">
        <div class="lightBoxBody">
                <div class="lightBoxImage">
                        <object width="420" height="315">
                                <param name="movie" value="https://www.youtube.c
                                <param name="allowFullScreen" value="true"></par
                                <param name="allowscriptaccess" value="always"><
                                <embed src="https://www.youtube.com/v/-EX8s4NvFA
                </div>
        </div>
        <div class="lightBoxContent">
                <p class="lightBoxTextContent"></p>
        </div>
        <div class="lightBoxNavigation">
                <div class="lightBoxNextPrevious">
                        <a class="lightBoxNextPrevious" href="#" onclick="za
                </div>
                <div class="lightBoxThumbnail">
                </div>
        </div>
</div>

Nahoru Odpovědět

24.5.2013 21:52

Amomym

Člen

Amomym:24.5.2013 21:59

díky moc, ale ještě bych to aj zkusil přes javascript, nebo je lepší css?

Nahoru Odpovědět

24.5.2013 21:59

Michal Žůrek - misaz

Tvůrce

Michal Žůrek - misaz:24.5.2013 22:00

To je fuk. Debilní uživatele pc mají javascript vypnutý.

Nahoru Odpovědět

24.5.2013 22:00

Amomym

Člen

Amomym:24.5.2013 22:04

řeknu to tak, na webu bude muset být i na více místech javascript, takže tady je to úplně jedno

Nahoru Odpovědět

24.5.2013 22:04

Amomym

Člen

Amomym:24.5.2013 22:24

Michael Olšavský pomůžeš prosím?

Nahoru Odpovědět

24.5.2013 22:24

Michael Olšavský

Tvůrce

Michael Olšavský:24.5.2013 22:36

:-) Pokusím se. Existují už hotové projekty, po úpravě můžeš vložit i video: http://lokeshdhakar.com/…s/lightbox2/

Nebo si napiš vlastní. Osobně mi css verze nepřijde jako nejvhodnější. Na tohle se používá Javascript(nebo alespoň používal). JQuery ti mnoho z práce usnadní. Hlavní ale bude vytvořit okno hned ve stránce, ale s průhlednost a vycentruj. Po kliknutí nastav zdroj obrázku(změň vlastnost src), průhlednost(visibility) a můžeš i zvětšit okno. ;-) zkus to nějak. Kdyžtak ještě poradím nebo to mohu zkusit sám napsat :-)

Nahoru Odpovědět

24.5.2013 22:36

Amomym

Člen

Amomym:24.5.2013 22:43

díky, pokusím se něco složit a naučit javascript, takže můžeš čekat, že se aspoň 2x zeptám

Nahoru Odpovědět

24.5.2013 22:43

Michal Žůrek - misaz

Tvůrce

Michal Žůrek - misaz:25.5.2013 8:01

A proč není css nejvhodnější? CO je na něm konktrétně špatně.

Nahoru Odpovědět

25.5.2013 8:01

Honza Bittner

Tvůrce

Honza Bittner:25.5.2013 9:00

jelikož je CSS jak název napovídá určeno ke stylům, JS je zase určeno k programování ...
Nač dělat dlouhé styly s malou efektivitou, když může JS vykonat práci snadno a efektivně

Nahoru Odpovědět

25.5.2013 9:00

FIT ČVUT alumnus :-) Sleduj mě na https://twitter.com/tenhobi a ptej se na cokoli na https://github.com/tenhobi/ama.

Michal Žůrek - misaz

Tvůrce

Michal Žůrek - misaz:25.5.2013 9:33

15 řádků je dlouhé?

Ale beru asi se na to moc nehodí.

Nahoru Odpovědět

25.5.2013 9:33

David Hartinger

Vlastník

David Hartinger:25.5.2013 9:33

Ten zdroják jsi tam nějak nevložil celý, docela by mě zajímalo jak to funguje. Kde že ti to běží?

Nahoru Odpovědět

25.5.2013 9:33

New kid back on the block with a R.I.P

Michal Žůrek - misaz

Tvůrce

Michal Žůrek - misaz:25.5.2013 9:36

Jestli myslíš to jak jsem to uřezal, tak to už bylo jenom youtube. Pak je v styleshetu jenom pozicovní tlačítek, barvičky atd. To co tu je je to nejdůležitější.

Nahoru Odpovědět

25.5.2013 9:36

David Hartinger

Vlastník

David Hartinger:25.5.2013 10:00

No a běží ti to někde?

Nahoru Odpovědět

25.5.2013 10:00

New kid back on the block with a R.I.P

Michal Žůrek - misaz

Tvůrce

Michal Žůrek - misaz:25.5.2013 11:13

Jako co by mi kde mělo běžet? Video přes embded - youtube, lightbox - css. Nic víc tam není.

Nahoru Odpovědět

25.5.2013 11:13

David Hartinger

Vlastník

David Hartinger:25.5.2013 11:25

Jestli máš někde ukázku.

Nahoru Odpovědět

25.5.2013 11:25

New kid back on the block with a R.I.P

Michal Žůrek - misaz

Tvůrce

Michal Žůrek - misaz:25.5.2013 11:35

Můžeš si to prohlídnout přímo v těch ambrožícíci: http://ambrozici.unas.cz/fotogalerie/#vid3

A že si to ty, tak sem na devbook tu ukázku dám.

Editováno 25.5.2013 11:36

Nahoru Odpovědět

25.5.2013 11:35

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 24 zpráv z 24.