Ukrywanie elementów w tabeli

0
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-2" />
<title>Pracownik</title>
<script type='text/javascript' src="jquery-1.7.1.min.js"></script>
<script type='text/javascript' src="opcja2.js"></script>
</head>
<body>
<table>
<tr>
	<div id="opcja1">
	<td>
    		<a href="#" id="start">Hello</a> 
    </td>
	</div>
	<div id="opcja2">
	<td>
			<a href="#" id="start2">Bye</a>
	</td>
	</div>
</tr>
</table>	
</body>
</html>

skrypt opcja2.js

$(document).ready( function() { 
   	$('#opcja1').show();
	$('#opcja2').hide();
	$("#start").click(function() { 
		$('#opcja1').hide();
		$('#opcja2').show();
	});
	$("#start2").click(function() { 
		$('#opcja2').hide();
		$('#opcja1').show();
	});
}); 

Bez tabeli skrypt śmiga elegancko, natomiast jak dodam

to przestaje działać. Nie chciałbym rezygnować z tabeli dlatego jak można rozwiąc problem?</p>
1

Umieść div wewnątrz komórki.

0

Wewnątrz jakiej komórki?

0

Wewnątrz komórki tabeli.

0

Sorry, może dlatego że jeste beginner, ale nie kumam jak umieścić div wewnątrz table

0

Wnętrzem komórki tabeli jest wszystko to, co pomiędzy <td>, a </td>.

0

O coś takiego chodzi:

...
</tr> ?
0

Ok, już rozkminiłem. THX! :)

0
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-2" />
<title>Pracownik</title>
<script type='text/javascript' src="jquery-1.7.1.min.js"></script>
<script type='text/javascript' src="opcja2.js"></script>
</head>
<body>
<table>
<tr>
		<td>
		<div id="opcja1">
    		<a href="#" id="start">Hello</a>
		</div>
		</td>
		<td>
		<div id="opcja2">
    		<a href="#">Hello</a>
		</div>
		</td>
		<td>
		<div id="opcja3">
    		<a href="#">Hello</a>
		</div>
		</td>
    </div>
	</td>
	<td colspan="3">
	<div id="opcja4">
			<a href="#" id="start2">Bye</a>
	</div>
	</td>
</tr>
</table>	
</body>
</html>

opcja2.js

$(document).ready( function() { 
   	$('#opcja1').show();
	$('#opcja4').hide();
	$("#start").click(function() { 
		$('#opcja1,#opcja2,#opcja3').hide();
		$('#opcja4').show();
	});
	$("#start2").click(function() { 
		$('#opcja4').hide();
		$('#opcja1,#opcja2,#opcja3').show();
	});
});  

Może ktoś poradzić jak zopytamlizować kod, bo dla każdej komórki używam teraz diva i w skyrpcie musze każdą po kolei zamykać.

0

To może zrezygnuj z tabeli i zrób wszystko na div'ach. Nie powinno się używać tabel do pozycjonowania elementów. Ewentualnie możesz ukrywać wiersz (<tr>) i wywalić div'y.

0

Dzięki.

Męczę się z kodem, może ktoś wskaże gdzie robie źle...

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-2" />
<title>Pracownik</title>
<link rel="stylesheet" type="text/css" href="css/default.css" />
<script type='text/javascript' src="js/jquery-1.7.1.min.js"></script>
<script type='text/javascript' src="js/check_form.js"></script>
<script type='text/javascript' src="js/opcja.js"></script>
</head>
<body>
<table cellspacing="0" width="1070" align="center">
<tr>
	<td align="center" background="img/top1.PNG" colspan="3" height="119" width="1070" valign="top">
    	<img align="right" alt="logo" src="img/logo.PNG" />
    </td>  
</tr>
<tr>
	<td align="center" background="img/middle.JPG" colspan="3" height="473" width="1070" valign="middle">
    </td>  
</tr>
<tr>
	<td align="center" background="img/menu.PNG" colspan="3" height="34" width="1070" valign="middle">
    		<img align="left" alt="login" src="img/oczekuj.PNG" />
	    </td>  
</tr>
<tr>
			<td background="img/bottom.PNG" height="125" width="356,5">
			<div id="wideo">
            <a href="#" id="start"><div id="connect"></div></a>
            <div id="chat_type">Wideo rozmowa</div>
			</div>
			</td>
			<td background="img/bottom.PNG" height="125" width="357">
			<div id="audio">
   	  		<a href="#"><div id="connect"></div></a>
            <div id="chat_type">Audio rozmowa</div>
			</div>
			</td>
			<td background="img/bottom.PNG" height="125" width="356,5">
			<div id="chater">
    		<a href="client-chat.php"><div id="connect"></div></a>
            <div id="chat_type">Chat rozmowa</div>
			</div>
			</td>
		</tr>
</table>
</body>
</html>

skrypt:

$(document).ready( function() { 
	$("#start").click(function() { 
		$('#audio').hide();
		$('#chater').hide();
	});
});  
0

Przyczyna jest ze skryptem, bo nie wiem dlaczego nie wykonuje się..

1 użytkowników online, w tym zalogowanych: 0, gości: 1