Diskuze: Slide-show

Kamil

Člen

Kamil:25.7.2013 10:04

Zdrarec,

mám takový dotaz, nevíte jak by šla udělat Slide-show prolínací a aby když kliknu na jeden "obrázek" aby mě to přesměrovalo na danou sekci kam chci?

Díky za odpověď.

Odpovědět

25.7.2013 10:04

David Čápka

Tým ITnetwork

Odpovídá na Kamil
David Čápka:25.7.2013 10:38

Nějakým jquery pluginem.

Nahoru Odpovědět

25.7.2013 10:38

One of the most common causes of failure is the habit of quitting when one is overtaken by temporary defeat.

Kamil

Člen

Kamil:25.7.2013 10:56

Ajaj...

Nahoru Odpovědět

25.7.2013 10:56

Kit

Tvůrce

Odpovídá na Kamil
Kit:25.7.2013 11:26

Ajaj ne. Jmenuje se to jQuery

Nahoru Odpovědět

25.7.2013 11:26

Vlastnosti objektů by neměly být veřejné. A to ani prostřednictvím getterů/setterů.

Kamil

Člen

Kamil:25.7.2013 12:43

Vím, už jsem se o něco pokus. Prosil bych ještě jednu radu. Potřeboval bych ty obrázky aby odkazovali. Zkoušel jsem před img dát odkaz ale bohužel pak slideshow nefunguje.

<html>
<head>
<title>Slide-Show</title>
<style>

#slideshow {
    position:relative;
    height:200px;
 width: 210px;
}
#slideshow img {
    position:absolute;
    top:10px;
    left:5px;
    border:solid black 1px;
}
</style>
<script type="text/javascript" src="jquery-1.10.2.min.js"></script>
<script>
function init() {
 $('#slideshow img').hide();

 $('#slideshow img:first').show();
}
function slide() {
    var $top = $('#slideshow img:visible');

    var $next;
 if($top.next().length > 0)
  $next = $top.next();

 else
        $next = $('#slideshow img:first');

 $top.hide();

 $next.show();
}

$(document).ready(function() {
 init();
    setInterval( "slide()", 3000 );
});

</script>
</head>
<body>


<div id="slideshow">
<img src="pokus.jpg" />
<img src="pokus2.jpg" />
<img src="pokus3.jpg" />
<img src="pokus4.jpg" />
<img src="pokus5.jpg" />
</div>


</body>
</html>

Nahoru Odpovědět

25.7.2013 12:43

Benjibs

Člen

Benjibs:25.7.2013 13:14

Upravil si príslušný css selektor na

#slideshow a img

Nahoru Odpovědět

25.7.2013 13:14

1 + 1 = 2

Kamil

Člen

Odpovídá na Benjibs
Kamil:25.7.2013 13:22

Nefunguje...

Nahoru Odpovědět

25.7.2013 13:22

Neaktivní uživatel

Tvůrce

Odpovídá na Kamil
Neaktivní uživatel:25.7.2013 14:27

V js místo

slideshow img:first

zkus

slideshow a:first

nebo

slideshow a:first img

Nahoru Odpovědět

25.7.2013 14:27

Neaktivní uživatelský účet

Kamil

Člen

Odpovídá na Neaktivní uživatel
Kamil:25.7.2013 14:33

<html>
<head>
<title>Slide-Show</title>
<style>

#slideshow  {
    position:relative;
    height:200px;
 width: 210px;
}
#slideshow a img {
    position:absolute;
    top:10px;
    left:5px;
    border:solid black 1px;
}
</style>
<script type="text/javascript" src="jquery-1.10.2.min.js"></script>
<script>
function init() {
 $('#slideshow  img').hide();

 $('#slideshow a:first img').show();
}
function slide() {
    var $top = $('#slideshow  img:visible');

    var $next;
 if($top.next().length > 0)
  $next = $top.next();

 else
        $next = $('#slideshow a:first img');

 $top.hide();

 $next.show();
}

$(document).ready(function() {
 init();
    setInterval( "slide()", 2000 );
});

</script>
</head>
<body>


<div id="slideshow">
<a href="http://www.seznam.cz"><img src="pokus.jpg" /></a>
<a href="http://www.seznam.cz"><img src="pokus2.jpg" /></a>
<a href="http://www.seznam.cz"><img src="pokus3.jpg" /></a>
<a href="http://www.seznam.cz"><img src="pokus4.jpg" /></a>
<a href="http://www.seznam.cz"><img src="pokus5.jpg" /></a>
</div>


</body>
</html>

Je to tak jak jsi myslel?
To taky nejde :/

Nahoru Odpovědět

25.7.2013 14:33

Neaktivní uživatel

Tvůrce

Odpovídá na Kamil
Neaktivní uživatel:25.7.2013 15:02

Tak teď už nevím ... to je jeden z důvodů, proč nemám rád js, nerozumím, proč při nepatrný změně přestane úplně fungovat

Nahoru Odpovědět

25.7.2013 15:02

Neaktivní uživatelský účet

Benjibs

Člen

Benjibs:25.7.2013 15:04

Firebug/konzola nevypisuje nič?

Nahoru Odpovědět

25.7.2013 15:04

1 + 1 = 2

Neaktivní uživatel

Tvůrce

Odpovídá na Kamil
Neaktivní uživatel:25.7.2013 15:06

Zkusil bych to ještě vrátit do původního stavu a přepsat všechny img tagy na a

Nahoru Odpovědět

25.7.2013 15:06

Neaktivní uživatelský účet

Kamil

Člen

Odpovídá na Neaktivní uživatel
Kamil:25.7.2013 15:39

Taky nejde :/

Nahoru Odpovědět

25.7.2013 15:39

Neaktivní uživatel

Tvůrce

Neaktivní uživatel:25.7.2013 15:54

Tak si počkej na Michal Žůrek - misaz nebo Honza Bittner

Nahoru Odpovědět

25.7.2013 15:54

Neaktivní uživatelský účet

Kamil

Člen

Odpovídá na Neaktivní uživatel
Kamil:25.7.2013 16:28

To jsem teda zvědav

Nahoru Odpovědět

25.7.2013 16:28

David Čápka

Tým ITnetwork

David Čápka:25.7.2013 17:33

JS píše chyby samozřejmě do konzole včetně řádky kde chyba je, stačí se tam podívat a ne to ladit naslepo. Jinak je lepší použít jednu z milionu hotových slideshow pro jquery jak jsem radil hned v 1. odpovědi.

Nahoru Odpovědět

25.7.2013 17:33

One of the most common causes of failure is the habit of quitting when one is overtaken by temporary defeat.

Michal Žůrek - misaz

Tvůrce

Michal Žůrek - misaz:25.7.2013 18:00

Ahoj, omlouvám se za zpoždění. Neumím jQuery, ale řekl bych javascriptu kde mám elementy img, ty bych si dal do pole a pak bych je postupně schovával/zobrazoval.

Nahoru Odpovědět

25.7.2013 18:00

Kamil

Člen

Odpovídá na David Čápka
Kamil:25.7.2013 18:48

Do konzole nevypíše nic.

Nahoru Odpovědět

25.7.2013 18:48

Kamil

Člen

Odpovídá na Benjibs
Kamil:25.7.2013 19:13

Nič.

Nahoru Odpovědět

25.7.2013 19:13

Kamil

Člen

Kamil:25.7.2013 23:09

Takže, nikdo neví?

Nahoru Odpovědět

25.7.2013 23:09

Tisíce ajťáků chybí, platy stoupají. Staň se hrdinou!

Zjistit více...

Zachránit situaci

Kritická situace!

Tisíce ajťáků chybí, platy stoupají. Staň se hrdinou!

Zachránit situaci

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