Вход

Просмотр полной версии : Сделать вкладку активной при загрузке страницы


kkolorid
02.12.2014, 13:23
Добрый день. Есть страница: sspromo.ru/ticket.php ,тело которой сделано из вкладок, которые открывают части стр... При первом попадании на страницу открывается первая вкладка.

Мне нужно сделать что бы ссылка в верхней основной навигации "О нас" вела на страницу ticket.php, при этом открывалась вкладка CONTACT.

Ссылки у вкладах по типу #tab-1. Делаю такие ссылки в каком то другом месте - ни чего не работает. Возможно будет какое то решение с использованием GET ссылки. Но не могу найти место, где выставить код для вкладки, открывающеюся по умолчанию. Заранее спасибо за помощь.

ruslan_mart
02.12.2014, 13:30
var hash = window.location.hash;
if(hash.indexOf('tab') > 0) {
var tabID = /tab-(\d+)/.exec(hash).pop();
document.querySelectorAll('#qcTabNav a')[tabID - 1].click();
}

А если так?

kkolorid
02.12.2014, 14:36
var hash = window.location.hash;
if(hash.indexOf('tab') > 0) {
var tabID = /tab-(\d+)/.exec(hash).pop();
document.querySelectorAll('#qcTabNav a')[tabID - 1].click();
}

А если так?

А куда сувать, простите? Просто скриптом на страницу? А потом что? Ссылка из навигации должна заработать? Или что? :(

Просто скрипт на стр поставил. Не пашет. Все так же думает, что это обычный якорь. И пишет его в адресную строку...

ruslan_mart
02.12.2014, 14:38
kkolorid, поставьте в конец страницы. Или оберните в window.addEventListener('load', function() { код });

А потом что? Ссылка из навигации должна заработать? Или что?
Верно. Ссылки типа:
http://sspromo.ru/ticket.php#tab-1
http://sspromo.ru/ticket.php#tab-2
http://sspromo.ru/ticket.php#tab-3

kkolorid
02.12.2014, 14:47
kkolorid, поставьте в конец страницы. Или оберните в window.addEventListener('load', function() { код });


Верно. Ссылки типа:
http://sspromo.ru/ticket.php#tab-1
http://sspromo.ru/ticket.php#tab-2
http://sspromo.ru/ticket.php#tab-3

Обернул в window.addEventListener и все получилось. При переходе с других страниц действительно открывается нужная вкладка. Но если я уже нахожусь на странице tickets.php - не работает. Только если обновить страницу с якорем в адресе.

ruslan_mart
02.12.2014, 14:52
Попробуйте у себя стереть три последних строчки.

// --------- 5. TESTIMONIAL ---------- //

$('#qcTestimonial p').html($('#qcTestimonialList li a.active').attr('data-content'));
$('#qcTestimonial cite').html('- ' + $('#qcTestimonialList li a.active').attr('data-cite'));
$('#qcTestimonialList li a').hover(function() {
$('#qcTestimonialList li a.active').removeAttr('class');
$(this).addClass('active');
$('#qcTestimonial p').html($(this).attr('data-content'));
$('#qcTestimonial cite').html('- ' + $(this).attr('data-cite'));
});
$('#qcTestimonialList li a').click(function() {
return false;
});

kkolorid
02.12.2014, 14:57
Попробуйте у себя стереть три последних строчки.

// --------- 5. TESTIMONIAL ---------- //

$('#qcTestimonial p').html($('#qcTestimonialList li a.active').attr('data-content'));
$('#qcTestimonial cite').html('- ' + $('#qcTestimonialList li a.active').attr('data-cite'));
$('#qcTestimonialList li a').hover(function() {
$('#qcTestimonialList li a.active').removeAttr('class');
$(this).addClass('active');
$('#qcTestimonial p').html($(this).attr('data-content'));
$('#qcTestimonial cite').html('- ' + $(this).attr('data-cite'));
});
$('#qcTestimonialList li a').click(function() {
return false;
});

Стер. Все так же :/

ruslan_mart
02.12.2014, 15:00
Ну тогда добавь в мой код:

$('#qcTabNav').on('click', 'a', function() {
window.location.hash = this.hash;
});

kkolorid
02.12.2014, 15:05
Ну тогда добавь в мой код:

$('#qcTabNav').on('click', 'a', function() {
window.location.hash = this.hash;
});

А куда именно? Под условие?

window.addEventListener('load', function() {
var hash = window.location.hash;

if(hash.indexOf('tab') > 0) {

var tabID = /tab-(\d+)/.exec(hash).pop();

document.querySelectorAll('#qcTabNav a')[tabID - 1].click();

$('#qcTabNav').on('click', 'a', function() {
window.location.hash = this.hash;
});

}


});

Вот так не работает... Может сделать просто что бы стр обновлялась?

ruslan_mart
02.12.2014, 15:09
$(function() {
var hash = window.location.hash;
if(hash.indexOf('tab') > 0) {
var tabID = /tab-(\d+)/.exec(hash).pop();
document.querySelectorAll('#qcTabNav a')[tabID - 1].click();
}
$('#qcTabNav').on('click', 'a', function() {
window.location.hash = this.hash;
});
});

Вот всё целиком.

kkolorid
02.12.2014, 15:12
$(function() {
var hash = window.location.hash;
if(hash.indexOf('tab') > 0) {
var tabID = /tab-(\d+)/.exec(hash).pop();
document.querySelectorAll('#qcTabNav a')[tabID - 1].click();
}
$('#qcTabNav').on('click', 'a', function() {
window.location.hash = this.hash;
});
});

Вот всё целиком.

Все по прежнему :/

ruslan_mart
02.12.2014, 15:21
Да чтож такое то. :-E

$(function() {
var hash = window.location.hash;
if(hash.indexOf('tab') > 0) {
var tabID = /tab-(\d+)/.exec(hash).pop();
document.querySelectorAll('#qcTabNav a')[tabID - 1].click();
}
$('#qcTabNav a').on('click', function() {
window.location.hash = this.hash;
});
});

kkolorid
02.12.2014, 15:28
Да чтож такое то. :-E

$(function() {
var hash = window.location.hash;
if(hash.indexOf('tab') > 0) {
var tabID = /tab-(\d+)/.exec(hash).pop();
document.querySelectorAll('#qcTabNav a')[tabID - 1].click();
}
$('#qcTabNav a').on('click', function() {
window.location.hash = this.hash;
});
});


Не выходит. И если оборачивать в window.addEventListener и если просто код выше вставлять..

ruslan_mart
02.12.2014, 15:31
kkolorid, ничего оборачивать не нужно, просто замените весь код, который вставляли до этого, на этот.

kkolorid
02.12.2014, 15:36
kkolorid, ничего оборачивать не нужно, просто замените весь код, который вставляли до этого, на этот.

Заменил. Все так же... Только теперь все вкладки такие ссылки делают. Поэтому якоря срабатывают и вниз кидает