| Autor | Zpráva | ||
|---|---|---|---|
| doraz Profil * |
#1 · Zasláno: 12. 7. 2012, 08:59:16
Zdravím!
Podle návodu na stránce http://jak.seznam.cz/example/widgets/lightbox jsem udělal galerii s tímto zápisem: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 //EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
<title>Nová stránka 1</title>
<script type="text/javascript" src="jak.js"></script>
<script type="text/javascript" src="icomponents.js"></script>
<script type="text/javascript" src="window.js"></script>
<script type="text/javascript" src="classmaker.js"></script>
<script type="text/javascript" src="browser.js"></script>
<script type="text/javascript" src="imagebrowser.js"></script>
<script type="text/javascript" src="signals.js"></script>
<script type="text/javascript" src="dom.js"></script>
<script type="text/javascript" src="main.js"></script>
<script type="text/javascript" src="lightbox.js"></script>
<link rel="stylesheet" type="text/css" href="lightbox-horizontal.css">
<link rel="stylesheet" type="text/css" href="lightbox-vertical.css">
<link rel="stylesheet" type="text/css" href="lightbox-slideshow.css">
<style type="text/css">
div.image-browser-root { _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=' img/widgets/lightbox/bg.png', sizingMethod='scale' );}
div[class~="image-browser-root"] { background: url( img/widgets/lightbox/bg.png); }
.image-browser-prev { position: absolute; top: 20px; left: 20px; display: block; width: 42px; height: 36px; cursor: pointer; background: url( img/widgets/lightbox/lb-previous-active.png); _background: none; _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=' img/widgets/lightbox/lb-previous-active.png'));}
.image-browser-prev:hover { background: url( img/widgets/lightbox/lb-previous-hover.png); _background: none; _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=' img/widgets/lightbox/lb-previous-hover.png')); }
.image-browser-next { position: absolute; top: 20px; left: 66px; display: block; width: 42px; height: 36px; cursor: pointer; background: url( img/widgets/lightbox/lb-next-active.png); _background: none; _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=' img/widgets/lightbox/lb-next-active.png')); }
.image-browser-next:hover { background: url( img/widgets/lightbox/lb-next-hover.png); _background: none; _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=' img/widgets/lightbox/lb-next-hover.png')); }
.image-browser-prev-disabled { position: absolute; top: 20px; left: 20px; display: block; width: 42px; height: 36px; cursor: pointer; background: url( img/widgets/lightbox/lb-previous-inactive.png); _background: none; _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=' img/widgets/lightbox/lb-previous-inactive.png')); }
.image-browser-next-disabled { position: absolute; top: 20px; left: 66px; display: block; width: 42px; height: 36px; cursor: pointer; background: url( img/widgets/lightbox/lb-next-inactive.png); _background: none; _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=' img/widgets/lightbox/lb-next-inactive.png')); }
.image-browser-close { position: absolute; top: 20px; left: 760px; display: block; width: 42px; height: 36px; cursor: pointer; background: url( img/widgets/lightbox/lb-close-active.png); _background:none ;_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=' img/widgets/lightbox/lb-close-active.png'));}
.image-browser-close:hover { background: url( img/widgets/lightbox/lb-close-hover.png); _background:none; _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=' img/widgets/lightbox/lb-close-hover.png'));}
div.image-browser-prev-preload { background: url( img/widgets/lightbox/lb-previous-hover.png);}
div.image-browser-next-preload { background: url( img/widgets/lightbox/lb-next-hover.png);}
div.image-browser-close-preload { background: url( img/widgets/lightbox/lb-close-hover.png);}
.lightBox {background-color: black; width: 960px; height: 600px; padding-top:10px; padding-left: 10px; padding-right: 10px;}
.lightBox .image-browser-image {width: 800px; height: 550px; border: 1px solid #333; overflow: hidden; padding: 0px; float: left; position: relative;}
.lightBox .image-browser-thumbs { width: 150px;height: 550px; overflow-y:scroll; float: right;}
.lightBox .image-browser-thumbs div.image-browser-thumb-box { height: 85px; width: 120px; padding: 0px; margin: 3px; border: 1px solid #333;}
.lightBox .image-browser-thumbs div.image-browser-active {border: 1px solid #fff;}
.lightBox .image-browser-caption { height: 40px; width: 800px; text-align:left; float: left; padding-left:5px; color: #fff; padding-top: 5px; font-family:Comic Sans MS; line-height:140%; font-size: 16px; }
.lightBox .image-browser-photo-count { width: 100px; margin-right: 35px; padding-top: 7px; text-align: center; float: right; color: #fff; font-family:Comic Sans MS; line-height:140%; font-size: 14px; }
.image-browser-slideshow-pause { position: absolute; top: 414px; left: 20px; display: block; width: 42px; height: 36px; cursor: pointer; background: url( img/widgets/lightbox/lb-slideshow-pause.png); _background:none ;_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=' img/widgets/lightbox/lb-slideshow-pause.png'));}
.image-browser-slideshow-play { position: absolute; top: 414px; left: 20px; display: block; width: 42px; height: 36px; cursor: pointer; background: url( img/widgets/lightbox/lb-slideshow-active.png); _background:none ;_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=' img/widgets/lightbox/lb-slideshow-active.png'));}
.image-browser-slideshow-play:hover { background: url( img/widgets/lightbox/lb-slideshow-hover.png); _background:none; _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=' img/widgets/lightbox/lb-slideshow-hover.png'));}
</style>
</head>
<body>
<font face="Times New Roman">
<script type="text/javascript">
var data = [
{alt: 'Les pod sněhem',description: 'Les pod sněhem', small: {url: 'images/sp4300084.jpg'}, big: {url: 'images/p4300084.jpg'} },
{alt: 'Osvětim', small: {url: 'images/sp4300085.jpg'}, big: {url: 'images/p4300085.jpg'} },
{alt: 'MIG-15 ve vojenském muzeu Kbely', small: {url: 'images/sp4300086.jpg'}, big: {url: 'images/p4300086.jpg'} },
{alt: 'Rozhledna', small: {url: 'images/sp4300087.jpg'}, big: {url: 'images/p4300087.jpg'} },
{alt: 'Beruška', small: {url: 'images/sp4300088.jpg'}, big: {url: 'images/p4300088.jpg'} },
{alt: 'Česká kotlina', small: {url: 'images/sp4300089.jpg'}, big: {url: 'images/p4300089.jpg'} },
{alt: 'Mochomůrka červená - houba nejedlá', small: {url: 'images/sp4300090.jpg'}, big: {url: 'images/p4300090.jpg'} },
{alt: 'Surikata - nejfotogeničtější zvířátko v ZOO', small: {url: 'images/sp4300091.jpg'}, big: {url: 'images/p4300091.jpg'} }
];
var opt = {
galleryClassName: "lightBox",
zIndex: 10,
components: {
strip: JAK.LightBox.Strip.Scrollable,
navigation: JAK.LightBox.Navigation.Basic,
anchorage: JAK.LightBox.Anchorage.Fixed,
main: JAK.LightBox.Main.CenteredScaled,
description: JAK.LightBox.Description.Basic,
others : [
{name: 'photos', part: JAK.Photos},
]
}
};
var g5 = new JAK.LightBox(data, opt);
window.cache.push(g5);
</script>
<a href="index22.htm" onclick="g5.show(0); return false;">otevřít galerii</a>
</font>
</body>Problém je následující: V Mozzile a Opeře se to bez problémů zobrazí, tak, jak má, ale pouze offline. Když to nahraju na server, tak se mi zobrazí pouze struktura galerie, ale bez fotek. V IE to projistotu nefunguje ani tak, ani tak. Zkoušel jsem tři servery (Wedos, Ebola, ic.cz), ale výsledek je stále stejný. Kde může být chyba? Díky moc. |
||
| Kajman Profil |
#2 · Zasláno: 12. 7. 2012, 09:22:15
doraz:
„Kde může být chyba?“ Mohla by být ve velikosti písmen souborů či adresářů s obrázky - pak se může přihodit, že na windows to bude fungovat a na serveru s linuxem ne. IE možná spadne na nadbytečné čárce na řádku 103. |
||
| doraz Profil * |
#3 · Zasláno: 12. 7. 2012, 09:56:31
Odstranil jsem tu čárku a skutečně se to v IE rozjelo, ale zase jenom offline. Malá a velká písmena mám všude shodná, takže tam chyba nebude...
|
||
| Kajman Profil |
#4 · Zasláno: 12. 7. 2012, 10:35:56
Těžko věštit, když nedodáte odkaz. Ještě jednou si zkontrolujte, zda jste na server obrázky nahrál a velikost písmen odpovídá jejich velikosti ve skriptu - můžete i pro kontrolu zadat cesty k obrázkům do prohlížeče - např. example.com/images/sp4300084.jpg
Také můžete např. v tom IE dát F12, na záložce síť si zapnout zachytávání, obnovit si tu stránky s galerií a zkontrolovat výsledky požadavků na obrázky a použité knihovny. |
||
| doraz Profil * |
#5 · Zasláno: 12. 7. 2012, 11:17:40
Tak už to mám!
Byly to skutečně malá/velká písmena v názvu těch obrázků....... To by mě nikdy nenapadlo. Díky moc! |
||
|
Časová prodleva: 12 let
|
|||
0