Jump to content
  • 0

подправить JS


Анна
 Share

Question

 function setLink(i) {
a[i].onclick = function () {
div[i].style.display = "block";
for(var j = 0; j < div.length; j++) {
if (i != j) {
div[j].style.display = "none";
}
}
return false;
}
}

function initTabs() {
var tabs = document.getElementById("container"); // put in id
var links = tabs.getElementsByTagName("a");
div = [];
a = [];

//Initialize tabs
for (var i = 0; i < links.length; i++) {
div[i] = document.getElementById(links[i].href.substr(links[i].href.indexOf("#") + 1));
if (i != 0) {
div[i].style.display="none";
} else {
div[i].style.display="block";
}
a[i] = links[i];
setLink(i)
}
}

вот этот код открывает определенный див, при клике на определённую ссылку, так как пока JS не учила, подскажите, пожалуйста, как сделать так, чтобы все блоки были закрытыми при входе на страницу, а то с этим кодом первый блок всегда открыт.

Link to comment
Share on other sites

5 answers to this question

Recommended Posts

  • 0

if (i != 0) {
div[i].style.display="none";
} else {
div[i].style.display="block";
}

Вот здесь указывается какой блок должен быть показан при загрузке. На данный момент стоит 0 - то есть первый блок. Если в дальнейшем придётся указать какой то другой блок, естественно значение можно поменять. А что бы спрятать их просто в css пропишите:

#container div {display: none;}

И уберите из JS выше выделенный код.

Либо если не трогая css то замените его на:

div[i].style.display="none";

Тогда блоки будут всегда показаны с отключённым JS и скроются только после исполнения этой функции.

  • Like 1
Link to comment
Share on other sites

  • 0

Заработало! Спасибо!

Если не сложно, копну чуток глубже, вот такая ситуация:

s_1315925618_5912679_618b937777.jpeg

На второй странице переход по ссылке работает вышеприведенным кодом(там галерея).

Как мне сделать переход с первой страницы на определенный див?

Link to comment
Share on other sites

  • 0

Можно например так, ссылка на первой странице выглядит следующим образом:

<a href="page2.htm#0">Page 2, Tab 1</a>

Где 0 - номер дива начиная с нуля.

Тогда код на второй странице меняется так - добавляем ещё одну переменную в функцию initTabs - hash и получаем значение указанное при переходе по ссылке.

var hash = +window.location.hash.slice(1) || 0;

|| 0 - форс мажорный случай когда произошёл обычный переход, устанавливает переменной значение 0, то есть - показываем нулевой блок. Если не нужно ничего показывать можно поменять на - || NaN.

После чего вставляем переменную hash в вышеприведённый код вместо нуля:

if (i != hash) {
div[i].style.display="none";
} else {
div[i].style.display="block";
}

И в принципе должно работать. Это самый примитивный способ, для начала. Потом можно попробовать пример с идентификаторами.

  • Like 1
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy