Próbuję użyć pańskiego kodu zamieszczonego w lekcji jak w temacie na swojej stronie, i niestety na kliknięcie więcej nic nie reaguje. Kod jest przepisany dokładnie.(Na stronie używam jeszcze ajax'a). Natomiast gdy odpalam go na czystej stronie działa bez problemu. Proszę o pomoc, gdyż muszę się z tym uporać najpóźniej do jutra wieczór. Dziękuję i pozdrawiam
Załączam 5 głównych plików i link do strony http://www.spammakers.cba.pl
index.html :
Code: Zaznacz cały
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"lang="pl">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta http-equiv="content-language" content="pl" />
<meta name="author" content="Jakub Onyśk" />
<meta name="robots" content="index, follow" />
<title>Bezpieczne Wakacje</title>
<meta name="description" content="Bezpieczne akacje, jak je spędzić przyjemnie, czego unikać, co robić" />
<meta name="keywords" content="bezpieczne wakacje, bezpieczne, wakacje, podróż, góry, morze, wakacje za granicą, sport, za granica" />
<link rel="shortcut icon" href="obrazki/favicon.ico" type="image/x-icon">
<script type="text/javascript" src="jquery-1.8.2.min"></script>
<script type="text/javascript" src="script.js"></script>
<link rel="stylesheet" type="text/css" href="style.css"/>
<script type="text/javascript" src="ajax.js"></script>
</head>
<body onload="laduj();contentLoad();">
<div id="kontener" align="center">
<img id="sloneczko" src="obrazki/bezpieczne-wakacje-ikona.png" width="100"/>
<img id="sloneczko2" src="obrazki/bezpieczne-wakacje-ikona.png" width="100"/>
<div id="logo">
<a href='index.html'><img border="0" src="obrazki/logo.png" width="768" height="284" onmouseover="cursor(this.id);"/></a>
</div>
<div id="menu-cale">
<img src="obrazki/ramka-menu.png" width="900" height="150" />
<div id="menu">
<ul id="lista-glowna" onmouseover="cursor(this.id);">
<li id="podroz" onclick="go(this.id,'content')">PODRÓŻ
<img src="obrazki/podroz.png" width="50">
</li>
<li id="gory" onclick="go(this.id,'content')">GÓRY
<img src="obrazki/gory.png" width="63">
</li>
<li id="morze" onclick="go(this.id,'content')">MORZE
<img src="obrazki/morze.png" width="61">
</li>
<li id="granica" onclick="go(this.id,'content')">GRANICA
<img src="obrazki/za-granica.png" width="63">
</li>
<li id="sport" onclick="go(this.id,'content')">SPORT
<img src="obrazki/sport.png" width="63">
</li>
</ul>
</div>
</div>
<!-- KONIEC MENU CAŁE-->`
<div id="content">
<p><strong>Wakacje</strong> jest to okres, w którym głównie dzieci i młodzież przebywają na podwórku oraz dużo podróżują. To 2 miesiące świetnej zabawy i wymarzonej przerwy od <em>szkoły!</em></p>
<p>Informacje na tej stronie pomogą Tobie spędzić ten czas bezpiecznie i przyjemnie, bez żadnych niespodzianek na początku nowego roku szkolnego.</p>
<p>W każdej zakładce tuż pod logiem strony, które umieszczone jest u góry, znajdziesz odpowiednie informacje dotyczące różnych form spędzania wakacji.</p>
</div>
<!-- KONIEC DIV CONENT-->
<div id="footer">©Jakub Onyśk</div>
</div>
<!-- KONIEC DIV KONTENER-->
</body>
</html>
Code: Zaznacz cały
//ONLOAD
function laduj()
{
function change(){
content = document.getElementById('content');
content.style.top = '-110px';
content.style.border = '10px inset #f6ffa8';
content.style.borderTop='0';
}
if(navigator.appName=="Microsoft Internet Explorer"){
change();
}
else
return true;
}
function cursor(id){
document.getElementById(id).style.cursor="pointer";
}
link=0;
function contentLoad(){
var wzor = new RegExp("#!", "gi");
var wzor2 = new RegExp("-", "gi");
url=window.location.href;
link = url.substr(url.indexOf("cje")+4);
if(wzor.test(link) && link!="#!" && link!="index.html#!"){
golyLink = link.substr(link.indexOf("#!")+2);//Gołe ID
tytul = " - Bezpieczne Wakacje"
switch(golyLink){
case"podroz":
document.title="Podróż "+tytul;
break;
case"gory":
document.title="Góry "+tytul;
break;
case"morze":
document.title="Morze "+tytul;
break;
case"granica":
document.title="Za granicą "+tytul;
break;
case"sport":
document.title="Sport "+tytul;
break;
default:
document.title="Bezpieczne Wakacje";
break;
}
if(wzor2.test(golyLink)){ //ID z -
podwojnyLink = golyLink.split("-"); // Podzielone id na
v1=podwojnyLink[0];//czyms
v2=podwojnyLink[1];//cos
switch(golyLink){
case"ogolne-podroz":
document.title="Podróż "+tytul;
break;
case"autokarem-podroz":
document.title="Podróż autokarem "+tytul;
break;
case"pociagiem-podroz":
document.title="Podróż pociągiem "+tytul;
break;
case"samolotem-podroz":
document.title="Podróż samolotem"+tytul;
break;
default:
document.title="Bezpieczne Wakacje";
break;
}
//Ładowanie contenta poszczególnego
go3(golyLink,v2,'content');//coś czyms
}
else{//Ładowanie menu głownego
go(golyLink,'content');
}
}
else
return false;
}
/*Rozwijanie*/
$("document").ready(
function()
{
$("div.naglowek span").each(
function(i)
{
$(this).addClass("gh"+i);
}
);
$("div.ukryty_tekst").each(
function(i)
{
$(this).addClass("gh"+i);
}
);
$("div.naglowek span").click(
function()
{
$("div."+$(this).attr("class")).toggle();
}
).toggle(
function()
{
$(this).text("schowaj");
},
function()
{
$(this).text("więcej");
}
);
}
);
Code: Zaznacz cały
window.onload = ajaxInit;
function ajaxInit() {
var XHR = null;
try {
XHR = new XMLHttpRequest();
}
catch(e){
try{
XHR = new ActiveXObject("Msxml2.XMLHTTP");
}
catch(e2){
try{
XHR = new ActiveXObject("Microsoft.XMLHTTP");
}
catch(e3){
alert("Niestety Twoja przeglądarka nie obsługuje AJAXA");
}
}
}
return XHR;
}
function go(id, whereToSend){
XHR = ajaxInit();
if (XHR != null){
XHR.open("GET", id+"/"+id+".html",true);
XHR.onreadystatechange = function(){
if (XHR.readyState == 4){
if (XHR.status == 200){
document.getElementById(whereToSend).innerHTML = XHR.responseText;
tytul = " - Bezpieczne Wakacje"
switch(id){
case"podroz":
document.title="Podróż "+tytul;
break;
case"gory":
document.title="Góry "+tytul;
break;
case"morze":
document.title="Morze "+tytul;
break;
case"granica":
document.title="Za granicą "+tytul;
break;
case"sport":
document.title="Sport "+tytul;
break;
default:
document.title="Bezpieczne Wakacje";
break;
}
window.location.href="#!"+id;
}
else
alert("Wystąpił błąd "+XHR.status+ " proszę o kontakt na...");
}
}
XHR.send(null);
}
}
function go2(id, whereToSend){
if(id.indexOf("-")){
c = id.split("-");
c2 = c[1];
}
XHR = ajaxInit();
if (XHR != null){
XHR.open("GET", c2+"/"+id+".html",true);
XHR.onreadystatechange = function(){
if (XHR.readyState == 4){
if (XHR.status == 200){
document.getElementById(whereToSend).innerHTML = XHR.responseText;
window.location.href="#!"+id;
switch(id){
case"ogolne-podroz":
document.title="Podróż "+tytul;
break;
case"autokarem-podroz":
document.title="Podróż autokarem "+tytul;
break;
case"pociagiem-podroz":
document.title="Podróż pociągiem "+tytul;
break;
case"samolotem-podroz":
document.title="Podróż samolotem"+tytul;
break;
default:
document.title="Bezpieczne Wakacje";
break;
}
}
else
alert("Wystąpił błąd "+XHR.status+ " proszę o kontakt na...");
}
}
XHR.send(null);
}
}
function go3(id,v2, whereToSend){
XHR = ajaxInit();
if (XHR != null){
XHR.open("GET", v2+"/"+id+"m.html",true);
XHR.onreadystatechange = function(){
if (XHR.readyState == 4){
if (XHR.status == 200){
document.getElementById(whereToSend).innerHTML = XHR.responseText;
window.location.href="#!"+id;
}
else
alert("Wystąpił błąd "+XHR.status+ " proszę o kontakt na...");
}
}
XHR.send(null);
}
}
Code: Zaznacz cały
<script type="text/javascript" src="jquery-1.8.2.js"></script>
<script type="text/javascript" src="script.js"></script>
<link rel="stylesheet" type="text/css" href="style.css"/>
<script type="text/javascript" src="ajax.js"></script>
<ul id="menu-podroz">
<li id="ogolne-podroz" onmouseover="cursor(this.id);" onclick="go2(this.id,'podroz-content');">Ogólne</li>
<li id="autokarem-podroz" onmouseover="cursor(this.id);" onclick="go2(this.id,'podroz-content');">Autokarem</li>
<li id="pociagiem-podroz" onmouseover="cursor(this.id);" onclick="go2(this.id,'podroz-content')">Pociągiem</li>
<li id="samolotem-podroz" onmouseover="cursor(this.id);" onclick="go2(this.id,'podroz-content');">Samolotem</li>
</ul>
<div id="podroz-content">
<ol id="podrozList">
<div class="naglowek"><li>Podczas podróży komunikacją miejską, bądź czujny, szczególnie gdy jest duży tłok. Możesz paść ofiarą kradzieży. Jak utrudnić złodziejowi jego pracę? Możesz:</li><span>więcej</span></div>
<div class="ukryty_tekst">
<ol>
<li>Trzymaj cenne rzeczy w przednich kieszeniach spodni, a gdy masz torebkę nie noś jej na pasku, zwłaszcza gdy stoisz blisko drzwi wyjściowych.</li>
<li>Wszystkiego rodzaju plecaki, miej w zasięgu wzroku i ręki.</li>
</ol></div>
<div class="naglowek"><li>Gdy jesteś zmuszony wrócić po ciemku, staraj się unikać nieoświetlonych uliczek, skrótów, i innych miejsc, które uważasz za niebezpieczne. Czasami lepiej się przejść kawałek dalej niż paść ofiarą złodzieja/mordercy itp. Kiedy nie masz możliwości udania się inną drogą to zachowaj pewne środki bezpieczeństwa: </li><span>więcej</span></div>
<div class="ukryty_tekst"><ol>
<li>Nie zwlekaj po drodze, tylko jak najszybciej przejdź do celu.</li>
<li>Nie wyciągaj cennych przedmiotów.</li>
<li>Miej oczy do o koła głowy.</li>
<li>Zaopatrz się w gaz pieprzowy, kiedy wiesz, że systematycznie będziesz chodził niebezpieczną częścią miasta.</li>
</ol></div>
<div class="naglowek"><li>Podróżując nie trzymaj przy sobie całej kwoty pieniędzy jaką dostałeś. Jeśli nie jest to możliwe: </li><span>więcej</span></div>
<div class="ukryty_tekst"><ol>
<li>Postaraj się jak najszybciej dotrzeć do miejsca docelowego</li>
<li>Zwróć uwagę czy ktoś Cię nie śledzi. Zawsze możesz zwrócić się o pomoc do strażnika bądź policjanta, którego mijasz.</li>
<li>Zaopatrz się w gaz pieprzowy, kiedy wiesz, że systematycznie będziesz chodził niebezpieczną częścią miasta.</li>
</ol></div>
<div class="naglowek"><li>Gdy będziesz musiał się bronić przed kimś tj. gdy naprawdę widzisz, że ktoś Cię biegnie Cię zaatakować. Tu są słabe punkty, które możesz wykorzystać</li><span>więcej</span></div>
<div class="ukryty_tekst"><ol>
<li>Gałki oczne</li>
<li>Krtań</li>
<li>Okolice pępka uderz otwartą dłonią, bądź łokciem, gdy napastnik zaszedł Cię od tyłu</li>
<li>Następnym ciosem atakującego może być uderzenie w twarz, pochyl się i łapiąc napastnika pod kolanami popchnij go w celu wywrócenia</li>
<li>Uderz rękoma w uszy z dwóch stron, tak jakbyś chciał coś zgnieść</li>
<li>Wykorzystuj do pomocy środowisko, bądź fakt że atakujący jest pijany(łatwo go wywrócić)</li>
</ol>
</div>
</ol>
</div>
Code: Zaznacz cały
*{
margin:0;
padding:0;
}
body{
background-image: url('obrazki/bezpieczne-wakacje-tlo.jpg');
background-attachment:fixed;
font-size:10px;
font-family:"Trebuchet MS", Geneva, Arial, Helvetica, sans-serif;
color:#1e3f00;
}
/*GORA STRONY*/
#footer{
position: relative;
bottom: -50px;
border:1px dashed orange;
border-bottom:none;
font-size:12px;
padding:10px 0 1px 0;
width:1000px;
height:20px;
border-radius:10px;
}
#logo{
position:relative;
left:10px;
}
#sloneczko{
position:relative;
left:470px;
top:180px;
z-index: -1;
}
#sloneczko2{
position:relative;
left:-480px;
top:180px;
z-index: -1;
}
div#kontener{
margin:auto;
width:1024px;
margin-top:-100px;
}
#menu{
position:relative;
width: 900px;
bottom:20px;
left:63px;
}
#menu ul{
position:relative;
bottom:110px;
}
#menu ul li{
width:120px;
list-style: none;
float:left;
border:1px solid black;
padding:5px;
font-size:25px;
font-family:"Courier New";
font-weight:bold;
margin:0 12px;
background-color: #ffdfd6;
opacity:0.8;
}
/* ŚRODEK STRONY*/
#content{
width:780px;
clear: left;
border:10px inset #f6ffa8;
border-top:none;
padding:20px;
font-size:20px;
position:relative;
top:-119px;
height:auto;
border-radius: 25px;
color:#6621b00;
}
#content p{
text-indent: 10px;
text-align:left;
margin:10px;
}
#zawartosc{
height:0px;
overflow: hidden;
visibility: hidden
}
/*PODRÓŻ*/
#menu-podroz{
position:relative;
left:5px;
margin-bottom: 50px;
padding-bottom:50px;
}
#menu-podroz li{
list-style:none;
float:left;
margin:0 5px;
border: 1px solid black;
color:#ffa905;
padding:10px;
border:5px inset white;
border-radius: 100px;
margin:0 35px;
background-color:#001917;
}
#podroz-content{
text-align:justify;
font-size:17px;
padding-left:20px;
}/*
ol#podrozList2, #podrozList3, #podrozList4, #podrozList5 {
font-size:16.5px;
font-style:italic;
color:#fbf1a1;
margin:10px 40px 35px;
list-style-type:lower-alpha;
}*/
div.naglowek
{
background-color: #BBB;
width: 416px;
padding: 7px;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 12px;
margin-top: 10px;
}
div.naglowek span
{
font-style: italic;
cursor: pointer;
}
div.ukryty_tekst
{
background-color: #CCC;
width: 400px;
padding: 15px;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 10px;
display: none;
}