Radim neki site i zapela sam očito na Java Scriptu
Unutar Spry Tabbled Panels imam nekoliko tabova a unutar njih fotke koje se prikazuju sa JQuery-em
problem je to što JQ vrti sve fotke unutar STPanela, a ne samo unutar određenog Taba
ima li pomoći za to?
tnx
ima pomoci, samo bez postanog koda, nema konkretne
predpostavljam da su tabovi "podijeljeni" sa <div> tagovima, ocito nisi stavila jq kod unutar jednog nego iznad svih
vjerovatno je to problem jer sam radila template i u glavni u zaglavlje stavila link na JS
gdje ga moram točno postaviti????
<head>
<script src="SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>
<link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="lightbox/js/jquery.js"></script>
<script type="text/javascript" src="lightbox/js/jquery.lightbox-0.5.min.js"></script>
<script type="text/javascript" src="lightbox/js/jquery.lightbox-0.5.js"></script>
<script type="text/javascript">
$(function() {
$('a.lightbox').lightBox();
});
</script>
<link href="lightbox/css/jquery.lightbox-0.5.css" rel="stylesheet" type="text/css" media="screen" />
</head>
<body>
<table>
<div id="TabbedPanels1" class="TabbedPanels">
<ul class="TabbedPanelsTabGroup">
<li class="TabbedPanelsTab" tabindex="0">naziv1</li>
<li class="TabbedPanelsTab" tabindex="0">naziv2</li>
<li class="TabbedPanelsTab" tabindex="0">naziv3</li>
<li class="TabbedPanelsTab" tabindex="0">naziv4</li>
<li class="TabbedPanelsTab" tabindex="0">naziv5</li>
<li class="TabbedPanelsTab" tabindex="0">naziv6</li>
</ul>
<div class="TabbedPanelsContentGroup">
<div class="TabbedPanelsContent">
<table width="54%" border="0" align="center" cellpadding="0" cellspacing="0" id="tablinije">
<tr>
<td width="127"><a href=........................................................................... /></a></td>
<td width="113"><a href=........................................................................... /></a></td>
<td width="117"><a href=........................................................................... /></a></td>
<td width="116"><a href=........................................................................... /></a></td>
<td width="116"><a href=........................................................................... /></a></td>
<td width="116"><a href=........................................................................... /> /a> </td>
<td width="90"> <a href=........................................................................... /></a></td>
</tr>
</table>
</div>
<div class="TabbedPanelsContent">
<table width="60%" border="0" align="center" cellpadding="0" cellspacing="0" id="tablinije2">
<tr>
<td width="127"><a href=........................................................................... /></a></td>
<td width="113"><a href=........................................................................... /></a></td>
<td width="117"><a href=........................................................................... /></a></td>
<td width="116"><a href=........................................................................... /></a></td>
<td width="116"><a href=........................................................................... /></a></td>
<td width="116"><a href=........................................................................... /> /a> </td>
<td width="90"> <a href=........................................................................... /></a></td>
</tr> </table>
</div>
<div class="TabbedPanelsConten">
<table width="60%" border="0" align="center" cellpadding="0" cellspacing="0" id="tablinije3">
<tr>
<td width="127"><a href=........................................................................... /></a></td>
<td width="113"><a href=........................................................................... /></a></td>
<td width="117"><a href=........................................................................... /></a></td>
<td width="116"><a href=........................................................................... /></a></td>
<td width="116"><a href=........................................................................... /></a></td>
<td width="116"><a href=........................................................................... /> /a> </td>
<td width="90"> <a href=........................................................................... /></a></td>
</tr>
<tr>
</tr>
</table>
</div>
<div class="TabbedPanelsContent">
<table width="60%" border="0" align="center" cellpadding="0" cellspacing="0" id="tablinije4">
<tr>
<td width="127"><a href=........................................................................... /></a></td>
<td width="113"><a href=........................................................................... /></a></td>
<td width="117"><a href=........................................................................... /></a></td>
<td width="116"><a href=........................................................................... /></a></td>
<td width="116"><a href=........................................................................... /></a></td>
<td width="116"><a href=........................................................................... /> /a> </td>
<td width="90"> <a href=........................................................................... /></a></td>
</tr>
</table>
</div>
<div class="TabbedPanelsContent">
<table width="60%" border="0" align="center" cellpadding="0" cellspacing="0" id="tablinije5">
<tr>
<td width="127"><a href=........................................................................... /></a></td>
<td width="113"><a href=........................................................................... /></a></td>
<td width="117"><a href=........................................................................... /></a></td>
<td width="116"><a href=........................................................................... /></a></td>
<td width="116"><a href=........................................................................... /></a></td>
<td width="116"><a href=........................................................................... /> /a> </td>
<td width="90"> <a href=........................................................................... /></a></td>
</tr>
</table>
</div>
<div class="TabbedPanelsContent">
<table width="60%" border="0" align="center" cellpadding="0" cellspacing="0" id="tablinije6">
<tr>
<td width="127"><a href=........................................................................... /></a></td>
<td width="113"><a href=........................................................................... /></a></td>
<td width="117"><a href=........................................................................... /></a></td>
<td width="116"><a href=........................................................................... /></a></td>
<td width="116"><a href=........................................................................... /></a></td>
<td width="116"><a href=........................................................................... /> /a> </td>
<td width="90"> <a href=........................................................................... /></a></td>
</tr>
</table>
<script type="text/javascript">
var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1");
</script>
</td>
.......
Nije neizvedivo.
Za početak razmisli što radi ova naredba:$('a.lightbox').lightBox();
Ono što ti moraš je razlikovati svaki tab (najbolje staviti svakome jedinstveni id) ili klasu linkova i onda za svaki pozvati lightbox() ovako:
$('#jedinstveni_id_taba1 a').lightbox();
$('#jedinstveni_id_taba2 a').lightbox();
$('#jedinstveni_id_taba3 a').lightbox();
ili ako si stavila svakom linku klasu lightbox onda:
$('#jedinstveni_id_taba1 a.lightbox').lightbox();
$('#jedinstveni_id_taba2 a.lightbox').lightbox();
$('#jedinstveni_id_taba3 a.lightbox').lightbox();
ili bez posebnih id-ova tabovima, ali posebne klase linkova unutar tabova:
$('a.lightbox1').lightbox();
$('a.lightbox2').lightbox();
$('a.lightbox3').lightbox();
Edit:
Dovoljan ti je jedan od ova dva pošto je to jedna te ista skripta:
<script type="text/javascript" src="lightbox/js/jquery.lightbox-0.5.min.js"></script>
<script type="text/javascript" src="lightbox/js/jquery.lightbox-0.5.js"></script>
pokušavam ali negdje opako griješim
I polako pusustajem jer nemam pojma gdje brljam,
Išla sam stavljati ID za svaki tab /TabbedPanelsContent (id=1; id=2; i id=3)/
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250" />
<title>Untitled Document</title>
<script src="SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>
<link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" />
<link href="lightbox/css/jquery.lightbox-0.5.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="lightbox/js/jquery.lightbox-0.5.min.js"></script>
<script type="text/javascript">
$(function() {
$('#1a.lightbox').lightBox();
$('#2a.lightbox').lightBox();
$('#3a.lightbox').lightBox();
;});
</script>
</head>
<body>
<div id="TabbedPanels1" class="TabbedPanels">
<ul class="TabbedPanelsTabGroup">
<li class="TabbedPanelsTab" tabindex="0" >sunce</li>
<li class="TabbedPanelsTab" tabindex="0" >zemlja</li>
<li class="TabbedPanelsTab" tabindex="0" >mars</li>
</ul>
<div class="TabbedPanelsContentGroup">
<div class="TabbedPanelsContent" id="1">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td> <a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
</tr>
</table>
</div>
<div class="TabbedPanelsContent" id="2" >
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td><a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
<td></td>
</tr>
</table>
</div>
<div class="TabbedPanelsContent"id="3">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td><a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
</tr>
</table>
</div>
</div>
</div>
<script type="text/javascript">
var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1");
</script>
</body>
</html>
Fali ti jquery.js:
<link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" />
<link href="lightbox/css/jquery.lightbox-0.5.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="lightbox/js/jquery.js"></script>
<script type="text/javascript" src="lightbox/js/jquery.lightbox-0.5.min.js"></script>
Fali razmak između id i elementa (a.lightbox pretpostavlja da ovim <a> elementima staviš class="lightbox", inače ti taj .lightbox ne treba):
$('#1 a').lightBox();
$('#2 a').lightBox();
$('#3 a').lightBox();
očito sam luda i ćorava
ne kužimmmmmmm gdje ne štima
po mojoj logici bi sve trablo raditi ali....
da nije možda problem u
ovom <script type="text/javascript">
var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1");
</script> sa dna <body>
Ako sada ne skužim odustajem !
<head>
<script src="SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>
<link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="lightbox/js/jquery.lightbox-0.5.js"></script><script type="text/javascript" src="lightbox/js/jquery.lightbox-0.5.min.js"></script>
<script type="text/javascript">
$(function() {
$('#1 a').lightBox();
$('#2 a').lightBox();
$('#3 a').lightBox();
;});
</script>
<link href="lightbox/css/jquery.lightbox-0.5.css" rel="stylesheet" type="text/css" media="screen" />
</head>
<body>
<body>
<div id="TabbedPanels1" class="TabbedPanels">
<ul class="TabbedPanelsTabGroup">
<li class="TabbedPanelsTab" tabindex="0" >sunce</li>
<li class="TabbedPanelsTab" tabindex="0" >zemlja</li>
<li class="TabbedPanelsTab" tabindex="0" >mars</li>
</ul>
<div class="TabbedPanelsContentGroup">
<div class="lightbox" id="1">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<<td> <a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
</tr>
</table>
</div>
<div class="lightbox" id="2" >
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td> <a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
</tr>
</table>
</div>
<div class="lightbox" id="3">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td> <a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td></td>
</tr>
</table>
</div>
</div>
</div>
<script type="text/javascript">
var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1");
</script>
</body>
</html>
Evo ti kôd:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250" />
<title>Untitled Document</title>
<script src="SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>
<link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" />
<link href="lightbox/css/jquery.lightbox-0.5.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="lightbox/js/jquery.js"></script>
<script type="text/javascript" src="lightbox/js/jquery.lightbox-0.5.min.js"></script>
<script type="text/javascript">
$(function() {
$('#1 a').lightBox();
$('#2 a').lightBox();
$('#3 a').lightBox();
});
</script>
</head>
<body>
<div id="TabbedPanels1" class="TabbedPanels">
<ul class="TabbedPanelsTabGroup">
<li class="TabbedPanelsTab" tabindex="0" >sunce</li>
<li class="TabbedPanelsTab" tabindex="0" >zemlja</li>
<li class="TabbedPanelsTab" tabindex="0" >mars</li>
</ul>
<div class="TabbedPanelsContentGroup">
<div class="TabbedPanelsContent" id="1">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td> <a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
</tr>
</table>
</div>
<div class="TabbedPanelsContent" id="2" >
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td><a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
<td></td>
</tr>
</table>
</div>
<div class="TabbedPanelsContent"id="3">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td><a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
<td><a href="..."><img src="..."/></a></td>
</tr>
</table>
</div>
</div>
</div>
<script type="text/javascript">
var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1");
</script>
</body>
</html>
Fakat radi
HVALA
spasio si me od sebe same
