Выполнение скрипта при открытии ссылки с параметром
Всем привет, Я НУБ :)
Есть сайт в теле которого содержимое меняется с помощью jquery методом измения видимости элементов через CSS. Изменяется всё это нажатием на Onclick ссылки... У них написан href="#blablabla" с решёткой (типо якорь), но он не нужен.. просто меняется ссылка в адресной строке.. Вроде как site.ru/#blabla1 , site.ru/#blabla2 , site.ru/#blabla3 Что мне нужно реализовать... чтобы при открытии ссылок (в адресной строке)такого вида ^ Запускалось то что срабатывает при нажатии на ссылки как-то так объяснил... Вообщем если открыть ссылку с другого сайта или просто её в адр.строку ввести , чтобы сработало измение видимости элементов. Сайт вот: http://express.sevstar.info/beta/ (на всякий случай) Конкретно о чём идёт речь: Скрит:
<script>
function Change(sdf) {if($(".cont" + sdf + "").css("display") == "none") {$(".cont1:visible,.cont2:visible,.cont3:visible,.cont4:visible,.cont5:visible,.cont6:visible,.cont7:visible,.cont8:visible,.cont9:visible").stop(true, true).hide(300);
$(".cont" + sdf + "").show(500);}}
</script>
То что в CSS:
.cont1 {display:none;}
.cont2 {display:none;}
.cont3 {display:none;}
.cont4 {display:none;}
.cont5 {display:none;}
.cont6 {display:none;}
.cont7 {display:none;}
.cont8 {display:none;}
.cont9 {}
Кнопчуки что меняют содержимое:
<li class=but1 onClick="Change('1');"><a href=#video>ВИДЕО</a></li>
<li class=but2 onClick="Change('2');"><a href=#music>МУЗЫКА</a></li>
<li class=but3 onClick="Change('3');"><a href=#games>ИГРЫ</a></li>
<li class=but4 onClick="Change('4');"><a href=#converse>ОБЩЕНИЕ</a></li>
<li class=but5 onClick="Change('5');"><a href=#portal>ПОРТАЛЫ</a></li>
<li class=but6 onClick="Change('6');"><a href=#servises>СЕРВИСЫ</a></li>
<li class=but7 onClick="Change('7');"><a href=#books>КНИГИ</a></li>
<li class=but8 onClick="Change('8');"><a href=#vkchat>ЧАТ ВК</a></li>
Элементы которые меняются типичные <div> с классом css.. А вообще если кто-то знает как это можно сделать проще, скажите, буду очень рад любым вариантам. |
то есть нужно чтобы при загрузке с различными якорями был различный дизайн?
для начала можно проверить значения якоря в window.location.hash при загрузке страницы
<!doctype html>
<html>
<head>
<script>
window.onload = function() {
var hash = window.location.hash;
var div = document.getElementById('id_a');
var result = 'no hash';
if (hash==='#a') {
result = 'aaa';
} else if (hash==='#b') {
result = 'bbb';
}
div.innerHTML = result;
}
</script>
</head>
<body>
<div id="id_a"></div>
</body>
</html>
это самый низкий уровень после этого можно проверить кроссбраузерность, использовать jquery или еще что-нибудь |
А может как-то проще в ссылке можно выполнить Change('1'); ,а я что-то выдумываю? типо site.ru/script=Change('1')
|
Цитата:
якори это максимум интерактивности, которую дают современные браузеры для url все остальное делается с помощью css и javascript конечно если захотеть можно запихать javascript в url и запустить его с помощью eval, но это прямое приглашение хакерам |
mta88,
Посмотрел я пример, но что-то он не работает, я так понял он разное содержимое в div выводит...? это не совсем то что мне нужно... Посмотрите пожалуйста сайт.. http://express.sevstar.info/beta/ Правильнее сказать что мне нужно как-то открывать вкладки (видео, музыка, игры...) по ссылкам... тоесть если человек получит ссылку (например site.ru/игры) то его сразу перекинет на страницу с играми, а не на первую |
Цитата:
я прочитал "пусть страница выглядит по разному в зависимости от значения якоря в url (#music, #books, ...)" это возможно -- достаточно проверить "window.location.hash" при загрузке странницы и запустить нужные скрипты, что я и показал |
а что если добавить функцию так:
<script>
function Change(sdf) {if($(".cont" + sdf + "").css("display") == "none") {$(".cont1:visible,.cont2:visible,.cont3:visible,.cont4:visible,.cont5:visible,.cont6:visible,.cont7:visible,.cont8:visible,.cont9:visible").stop(true, true).hide(300);
$(".cont" + sdf + "").show(500);}}
$(document).ready(function(){
var hash = window.location.hash;
switch(hash){
case '#video' : Change('1')
break
case '#music' : Change('2')
break
case '#games' : Change('3')
break
case '#converse' : Change('4')
break
case '#portal' : Change('5')
break
case '#servises' : Change('6')
break
case '#books' : Change('7')
break
case '#vkchat' : Change('8')
break
}
});
</script>
|
Цитата:
Принцип DRY придумали неудачники ) |
Цитата:
это у топикстартера много повторений, а NeoN только один switch добавил дешево и сердито |
Цитата:
$(function(){
var a = window.location.hash, b = ['video', 'music', 'games', 'converse', 'portal', 'servises', 'books', 'vkchat'];
for(i=0; i<b.length; i++) if(a == '#'+b[i]) Change(i+1);
});
|
| Часовой пояс GMT +3, время: 07:48. |