Единый форум поддержки

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » Единый форум поддержки » Корзина » Переключение между категориями


Переключение между категориями

Сообщений 1 страница 20 из 24

1

посмотрите, будет ли работать у вас...

Код:
<style type="text/css">
ul.tabs {margin-left: 5%; margin-top:23px; margin-right:0;}
ul.tabs li {background: url('http://forumupload.ru/uploads/0003/44/61/4246-1-f.png') right; -moz-border-radius:10px 0 0 10px;
	-webkit-border-radius:10px 0 0 10px;
	border-radius:10px 0 0 10px;
float: right; width:100%; margin-top: 4px; padding:6px; padding-right:-4;}
ul.tabs li a {color: #999999; text-decoration: none;}
ul.tabs li:hover a, ul.tabs li:hover a:hover {text-decoration: none; color: #ffffff; width:100%;}
ul.tabs li:hover {margin-left: 3%; width: 97%;}
ul.tabs li.active {background:#534C49; margin-left: 5%; width: 95%;}
ul.tabs li.active a {text-decoration: none; color: #C2ED5B;}
.container .tabs ul, .container .tabs ul li {float: right;}
</style>
Код:
<script type="text/javascript">

$(document).ready(function() {


	$(".category").hide(); 
	$("ul.tabs li:first").addClass("active").show();
	$(".category:first").show();
	
	$("ul.tabs li").click(function() {
$("ul.tabs li").removeClass("active");
$(this).addClass("active");
$(".category").hide();
var activeTab = $(this).find("a").attr("href");
$(activeTab).fadeIn();
return false;
	});

});

</script>

<script type="text/javascript">
var news = new Array ()
news.push(new Array("Не суть важно", '<ul class="tabs" style="float:right;"><li class="active"><a href="#pun-category1">Категория 1</a></li><li><a href="#pun-category2">Категория 2</a></li><li><a href="#pun-category3">Категория 3</a></li><li><a href="#pun-category4">Категория 4</a></li><li><a href="#pun-category5">Категория 5</a></li><li><a href="#pun-category6">Категория 6</a></li><li><a href="#pun-category7">Категория 7</a></li><li><a href="#pun-category8">Категория 8"</a></li></ul>'))
var mynews = "";
for (q=0; q<news.length; q++){
mynews += "<div class='container'>"+news[q][1]+"</div><br /><br />";
}
var block=mynews;
var arr=document.getElementsByTagName("div")
i=0
str=document.URL
while(arr[i] ){
if((str.substring(str.lastIndexOf('/')+1)=="" || str.substring(str.lastIndexOf('/')+1)=="index.php") && arr[i].className=="main"){
name=arr[i].innerHTML
name=name.substring(0)
arr[i].innerHTML="<table><tr><td valign=top width=20% style=\"padding-right:0px;\">"+block+"</td><td  width=80% style=\"padding-left:0px;\" >"+name+"</td></tr></table>"
}
i++
}
</script>

С подключённой библиотекой jQuery.

Если имеются здесь скриптеры, то помогите, позязя, правильно сиё реализовать. Сейчас скрипт работает прекрасно, но вижу, что он корявый. Сделан на основе jQuery Tabs и Новостных блоков от Duka

Опасно ставить, если у вас уже установлены Новостные блоки от Duka


Первая, бросающаяся в глаза корявость - при наличии скрытых категорий в середине - всё покосится =(

Отредактировано Kven (Пн, 6 Дек 2010 20:07:50)

0

2

Kven
Здравствуйте.

Kven написал(а):

Если имеются здесь скриптеры, то помогите, позязя, правильно сиё реализовать.

Я бы Вам посоветовал обратиться к пользователям mkusher или Romych. Они хорошо понимают в этом.

0

3

Kven
спёр

Kven написал(а):

Первая, бросающаяся в глаза корявость - при наличии скрытых категорий в середине - всё покосится =(

как выход - взять ещё один скрипт, который скрывает определённую тему, от определённых груп, снова переписать её, и заиньектить в скрипт.
или создавать подфорумы, например в категории "Тех. сторона форума", она у вас отлично подходит названием под девелоперский).

Отредактировано Ita Ita (Вт, 7 Дек 2010 23:57:54)

0

4

Ita Ita написал(а):

она у вас отлично подходит названием под девелоперский

Там-то всё и кроется ^^

Ita Ita написал(а):

взять ещё один скрипт, который скрывает определённую тему, от определённых груп

подумаю
но всёж стоит скриптеров мягко потрясти за рукав :)

0

5

Kven Вот тут есть Вариант, где иконка устанавливаецо в категорию по названию(суть не в иконках, а аналогичным образом по названию сворачивать разворачивать), там уже скрытость не страшна и симпатичней и информативней - нежели категория 1 -2 и т.д >

http://forum.mybb.ru/viewtopic.php?id=24229

Отредактировано Deff (Ср, 8 Дек 2010 10:59:16)

0

6

Kven
что-то я сути проблемы не понял,
так работает у вас этот скрипт или нет?

0

7

Romych Скрипт работает, он переживат, что при наличии категорий скрытых - одна и таж кнопка с одним номером указывает на разные категории, удобней конечно сделать по имени категории  и автоматически приводить имя и кол во категорий( тут жестко 8 штук сейчас

http://hostjs-mybb2011.narod.ru/Switching_between_category.htm

(из-за не муbb скрипт чуть обрезан

Отредактировано Deff (Ср, 8 Дек 2010 21:59:31)

0

8

Romych
Ты б его лучше б переписал, чтоб внешне выглядел нормально. И чтоб категории скрытые из списка убирал, а ещё сам считал число категорий, ибо у некоторых из штук по 20, а вставлять вручную - слишком муторно.
Короче говоря, автоматизируй процесс.

0

9

Deff написал(а):

автоматически приводит имя и кол во категорий

rps написал(а):

Короче говоря, автоматизируй процесс

Как же радуют такие отзывчивы люди ^^
именно то, что требуется)
Romych, скрипт работает, но он собран из двух и собран неучем ><".
Даже представляю, что должен скрипт сделать) Но написать не могу: только начал читать введение в javascript; получившееся - всё, на что хватило знаний и интуитивного понимания кода.
Нуна подсчитать дивы с классом category, а после вынимать из каждого #pun-categoryX h2 (где x - номер категории) название этой категории, после чего вставить в ul с неким id (в скрипте только класс указан, нуна id добавить)

<li><a href="#pun-categoryX">Текст в #pun-categoryX h2 </a></li>

Спасибо за внимание к проблеме)

Отредактировано Kven (Ср, 8 Дек 2010 22:10:38)

0

10

Kven написал(а):

Нуна подсчитать дивы с классом category, а после вынимать из каждого #pun-categoryX h2 (где x - номер категории) название этой категории, после чего вставить в ul с неким id (в скрипте только класс указан, нуна id добавить)

это ребят, весьма сложная задачка

снять автоматом номер категории и тем более её название можно только регулярным выражением
получится она примерно такая:

некая переменная = /\<div class=\"category\" id=\"pun-category(\d+)\" style=\"display: block;\"\>\<h2\>\<div class=\"catleft\">\<\!-- --\>\<\/div\>\<span\>(.*?)\<\/spa\n>\<div class=\"catright\"\>\<\!-- --\>\<\/div\>\<\/h2\>/g

где то, что выделено красным, подшаблон который снимает порядковый номер категории,
а то что синим - название её

потом это всё должно подставляться в ссылку из списка

<li><a href="#pun-category$1">$2</a></li>

как то так,
может быть есть способ проще, но пока его не вижу

по поводу неумелого соединения двух скриптов в один,
если работает, то замечательно,
хотя можно и ещё покороче соединить, примерно так:

это в html-верх

<style type="text/css">
ul.tabs {margin-left: 5%; margin-top:23px; margin-right:0;}
ul.tabs li {background: url('http://forumupload.ru/uploads/0003/44/61/4246-1-f.png') right; -moz-border-radius:10px 0 0 10px;-webkit-border-radius:10px 0 0 10px;border-radius:10px 0 0 10px;
float: right; width:100%; margin-top: 4px; padding:6px; padding-right:-4;}
ul.tabs li a {color: #999999; text-decoration: none;}
ul.tabs li:hover a, ul.tabs li:hover a:hover {text-decoration: none; color: #ffffff; width:100%;}
ul.tabs li:hover {margin-left: 3%; width: 97%;background:#838B8B;}
ul.tabs li.active {background:#534C49; margin-left: 5%; width: 95%;}
ul.tabs li.active a {text-decoration: none; color: #C2ED5B;}
div.category {width:80%;}
</style>

это в html-низ

<script type="text/javascript">
$(function() {
$('div#pun-main').prepend('<div id="categ" style="position:static;width:20%;float:right;background-color:#F5F5F5;"><ul class="tabs" style="float:right;"><li class="active"><a href="#pun-category1">Название категории 1</a></li><li><a href="#pun-category2">Категория 2</a></li><li><a href="#pun-category3">Категория 3</a></li><li><a href="#pun-category4">Категория 4</a></li><li><a href="#pun-category5">Категория 5</a></li><li><a href="#pun-category6">Категория 6</a></li><li><a href="#pun-category7">Категория 7</a></li></ul></div>');
$(".category").hide();
$("ul.tabs li:first").addClass("active").show();
$(".category:first").show();
$("ul.tabs li").click(function() {
$("ul.tabs li").removeClass("active");
$(this).addClass("active");
$(".category").hide();
var activeTab = $(this).find("a").attr("href");
$(activeTab).fadeIn();
return false;
}); });
if(document.URL != 'здесь адрес форума'){document.getElementById('categ').style.display = 'none';}
</script>

+3

11

только в моём варианте список ссылок на категории получается справа

+1

12

Romych
ура, заработало во всех браузерах.
осталось только скрыть категории, которые не видны пользователям с ограниченными правами).
рано обрадовался...
если зайти в подфорум - то сразу видны глюки, ибо форум там не сжимается.
в темах эта фишка вообще просто адово выглядит)..

Отредактировано Ita Ita (Чт, 9 Дек 2010 00:45:04)

0

13

Romych написал(а):

снять автоматом номер категории и тем более её название можно только регулярным выражениемполучится она примерно такая:

Можа типо так >

$(document).ready(function(){
      ...
     $(' div.category ').each(function (i) {
   $(' Наш div или таб, куда складываем кликабельные планки).ul ').append(<h2><li><a href="\""+$(this').attr('id')+"\">"+$(this}.next('h2.span').text()+"</a></li></h2>");
   }
}
  });

Отредактировано Deff (Чт, 9 Дек 2010 07:40:50)

0

14

Ita Ita написал(а):

если зайти в подфорум - то сразу видны глюки, ибо форум там не сжимается.
в темах эта фишка вообще просто адово выглядит)..

а вы адрес вашего форума в скрипте вставили в том месте. которое выделенно жёлтым?

Deff написал(а):

Можа типо так >

возможно,
завтра погляжу

0

15

http://forum.mybb.ru/viewtopic.php?id=25107#p637431, пост №14

Romych написал(а):

а вы адрес вашего форума в скрипте вставили в том месте. которое выделенно жёлтым?

Ксать мож стоит - везде style.display = 'none' а на главной style.display = 'block!mportant'  -  ?

str=document.URL
if(str.substring(str.lastIndexOf('/')+1)=="" || str.substring(str.lastIndexOf('/')+1)=="index.php")
   document.write("<style>#categ {display:block!mportant;}</style>")

Отредактировано Deff (Чт, 9 Дек 2010 15:15:10)

0

16

Romych написал(а):

а вы адрес вашего форума в скрипте вставили в том месте. которое выделенно жёлтым?

вставлял конечно хотя и не понимаю что это даёт..

0

17

Ita Ita написал(а):

хотя и не понимаю что это даёт

Появление дива с переключением только на главной, на других страницах он отображаться не должен)

0

18

http://wayfarer.mybb.ru/
тут стоит скрипт, везде всё повставлял, работает исключительно на всех страницах
пытался копатся в нём, но он либо стаёт широченным, либо вовсе исчезает.

0

19

Ващет Кнопки слева лучше смотрелись

Отредактировано Deff (Чт, 9 Дек 2010 14:46:16)

0

20

Ita Ita написал(а):

тут стоит скрипт, везде всё повставлял, работает исключительно на всех страницах

Опять же - вырвал из скрипта Duka кусочег.

Код:
<script type="text/javascript">
$(function() {
$('div#pun-main').prepend('<div id="categ" style="position:static;width:20%;float:right;background-color:transparent none !important;"><ul class="tabs" style="float:right;"><li class="active"><a href="#pun-category1">Название категории 1</a></li><li><a href="#pun-category2">Категория 2</a></li><li><a href="#pun-category3">Категория 3</a></li><li><a href="#pun-category4">Категория 4</a></li><li><a href="#pun-category5">Категория 5</a></li><li><a href="#pun-category6">Категория 6</a></li><li><a href="#pun-category7">Категория 7</a></li></ul></div>');
$(".category").hide();
$("ul.tabs li:first").addClass("active").show();
$(".category:first").show();
$("ul.tabs li").click(function() {
$("ul.tabs li").removeClass("active");
$(this).addClass("active");
$(".category").hide();
var activeTab = $(this).find("a").attr("href");
$(activeTab).fadeIn();
return false;
}); });
str=document.URL;
if(str.substring(str.lastIndexOf('/')+1)=="" || str.substring(str.lastIndexOf('/')+1)=="index.php"){document.getElementById('categ').style.display = 'block';}
</script>

Но в стиль дописать

Код:
<style type="text/css">
#categ {display:none;}
</style>

0


Вы здесь » Единый форум поддержки » Корзина » Переключение между категориями