NOVINKA - Online rekvalifikační kurz Python programátor. Oblíbená a studenty ověřená rekvalifikace - nyní i online.
Hledáme nové posily do ITnetwork týmu. Podívej se na volné pozice a přidej se do nejagilnější firmy na trhu - Více informací.
Avatar
Amomym
Člen
Avatar
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 :D.

 
Odpovědět
24.5.2013 20:24
Avatar
Amomym
Člen
Avatar
Amomym:24.5.2013 21:36

???

 
Nahoru Odpovědět
24.5.2013 21:36
Avatar
niveses
Tvůrce
Avatar
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
Avatar
Michael Olšavský
Tvůrce
Avatar
Odpovídá na Amomym
Michael Olšavský:24.5.2013 21:38

Co si predstavujes pod oknem?

 
Nahoru Odpovědět
24.5.2013 21:38
Avatar
Amomym
Člen
Avatar
Odpovídá na Michael Olšavský
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
Avatar
Michal Žůrek - misaz
Tvůrce
Avatar
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
Avatar
Michal Žůrek - misaz
Tvůrce
Avatar
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
Avatar
Amomym
Člen
Avatar
Odpovídá na Michal Žůrek - misaz
Amomym:24.5.2013 21:50

ano, toto myslím

 
Nahoru Odpovědět
24.5.2013 21:50
Avatar
Michal Žůrek - misaz
Tvůrce
Avatar
Odpovídá na Amomym
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
Avatar
Amomym
Člen
Avatar
Odpovídá na Michal Žůrek - misaz
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
Avatar
Michal Žůrek - misaz
Tvůrce
Avatar
Odpovídá na Amomym
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
Avatar
Amomym
Člen
Avatar
Odpovídá na Michal Žůrek - misaz
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 :D

 
Nahoru Odpovědět
24.5.2013 22:04
Avatar
Amomym
Člen
Avatar
Amomym:24.5.2013 22:24

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

 
Nahoru Odpovědět
24.5.2013 22:24
Avatar
Michael Olšavský
Tvůrce
Avatar
Odpovídá na Amomym
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(vi­sibility) 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
Avatar
Amomym
Člen
Avatar
Odpovídá na Michael Olšavský
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 :D

 
Nahoru Odpovědět
24.5.2013 22:43
Avatar
Michal Žůrek - misaz
Tvůrce
Avatar
Odpovídá na Michael Olšavský
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
Avatar
Honza Bittner
Tvůrce
Avatar
Odpovídá na Michal Žůrek - misaz
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.
Avatar
Michal Žůrek - misaz
Tvůrce
Avatar
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
Avatar
David Hartinger
Vlastník
Avatar
Odpovídá na Michal Žůrek - misaz
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
Avatar
Michal Žůrek - misaz
Tvůrce
Avatar
Odpovídá na David Hartinger
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
Avatar
David Hartinger
Vlastník
Avatar
Odpovídá na Michal Žůrek - misaz
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
Avatar
Michal Žůrek - misaz
Tvůrce
Avatar
Odpovídá na David Hartinger
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
Avatar
David Hartinger
Vlastník
Avatar
Odpovídá na Michal Žůrek - misaz
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
Avatar
Michal Žůrek - misaz
Tvůrce
Avatar
Odpovídá na David Hartinger
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.