Diskuze: Slide-show
V předchozím kvízu, Online test znalostí HTML a CSS, jsme si ověřili nabyté zkušenosti z kurzu.
Zobrazeno 20 zpráv z 20.
K personalizaci obsahu a reklam, poskytování funkcí sociálních médií a analýze naší návštěvnosti využíváme soubory cookie. Informace o tom, jak náš web používáte, sdílíme se svými partnery pro sociální média, inzerci a analýzy. Partneři tyto údaje mohou zkombinovat s dalšími informacemi, které jste jim poskytli nebo které získali v důsledku toho, že používáte jejich služby.
Používáme nezbytné cookies pro fungování webu a s tvým souhlasem také analytické a marketingové cookies.
Zajišťují základní funkce, bezpečnost a služby, které sis vyžádal. Nelze je vypnout.
| Služba | Poskytovatel | Účel | Cookies a úložiště | Doba uložení |
|---|---|---|---|---|
| ITnetwork | ITnetwork | Provoz webu, relace, přihlášení a uložení nastavení cookies. | PHPSESSID, auth_token, sid, itn_consent_impression, __Host-itn_consent | Relace až 1 rok |
| Google Tag Manager | Správa značek a načítání měřicích nástrojů webu. | Žádné | Neukládá se | |
| Google Fonts | Načítání typografie webu. | Úložiště řízené poskytovatelem | Dle podmínek poskytovatele | |
| Google Hosted Libraries | Načítání potřebných knihoven a stylů webu. | Úložiště řízené poskytovatelem | Dle podmínek poskytovatele | |
| Google reCAPTCHA | Ochrana formulářů a webu před zneužitím. | _GRECAPTCHA, rc::a, rc::b, rc::c, rc::f | Relace až 180 dní | |
| YouTube | Přehrávání vloženého video obsahu. | localStorage, IndexedDB; cookies after playback interaction | Relace až trvalé úložiště | |
| Vimeo | Vimeo | Přehrávání vloženého video obsahu. | __cf_bm, _cfuvid, vuid, localStorage, IndexedDB | Relace až 2 roky |
| Facebook Login | Meta | Přihlášení pomocí účtu třetí strany. | Úložiště řízené poskytovatelem | Relace až 1 rok |
| GoPay | GoPay | Zpracování uživatelem vyžádané platby. | Úložiště řízené poskytovatelem | Dle podmínek poskytovatele |
Pomáhají nám porozumět používání webu a zlepšovat ho.
| Služba | Poskytovatel | Účel | Cookies a úložiště | Doba uložení |
|---|---|---|---|---|
| Google Analytics 4 | Měření návštěvnosti a používání webu. | _ga, _ga_* | Až 2 roky | |
| Microsoft Clarity | Microsoft | Měření návštěvnosti a používání webu. | _clck, _clsk, _cltk | Relace až 1 rok |
Slouží k měření kampaní, personalizaci reklamy a marketingové komunikaci.
| Služba | Poskytovatel | Účel | Cookies a úložiště | Doba uložení |
|---|---|---|---|---|
| Google Ads | Měření kampaní, reklama a remarketing. | _gcl_au, _gcl_ls | Relace až 90 dní | |
| Meta Pixel | Meta | Měření kampaní, reklama a remarketing. | _fbp, _fbc, localStorage | Až 90 dní |
| Sklik | Seznam.cz | Měření kampaní, reklama a remarketing. | retargeting, sid, szn:* | Relace až trvalé úložiště |
| LinkedIn Insight | Měření kampaní, reklama a remarketing. | bcookie, li_gc, lidc, __cf_bm | Relace až 1 rok | |
| Ecomail | Ecomail.cz | Měření kampaní, reklama a remarketing. | ecmid, Úložiště řízené poskytovatelem | Dle podmínek poskytovatele |
| Atribuce kampaní ITnetwork | ITnetwork | Přiřazení návštěvy a objednávky ke kampani. | campaign_clid[*], user_session_context | Až 1 rok |
V předchozím kvízu, Online test znalostí HTML a CSS, jsme si ověřili nabyté zkušenosti z kurzu.
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>
V js místo
slideshow img:first
zkus
slideshow a:first
nebo
slideshow a:first img
<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 :/
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 
Zkusil bych to ještě vrátit do původního stavu a přepsat všechny img
tagy na a 
Tak si počkej na Michal Žůrek - misaz nebo Honza Bittner 
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.
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.
Zobrazeno 20 zpráv z 20.
