Бесплатный форум: форум поддержки
Добро пожаловать на форум поддержки сервиса Forum2x2 !

Для полноценной работы с форумом,
пожалуйста, войдите на форум под своим логином (если вы уже зарегистрированы) или же зарегистрируйтесь.


С нашей помощью вы можете создать форум,
похожий на этот!
Мы в социальных сетях

Правила форума

для обязательного прочтения!


Внимание! Важная информация для РЕГИСТРАЦИИ на форуме:

Пожалуйста, не регистрируйтесь на этом форуме с электронными адресами mail.ru, bk.ru, inbox.ru, list.ru - вам может не прийти письмо со ссылкой активации!
Вы можете воспользоваться адресами типа yandex.ru, rambler.ru, gmail.com и т.д.
Интересные решения
Быстрый переход к сервисам: j-p-g.net Видео фоторедактор Транслит

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

Предыдущая тема Следующая тема Перейти вниз

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

Сообщение автор Сказочник Зазеркалья в Чт 28 Мар - 3:22

Приветик. girl_yes

Плиз помогите сделать две и более боковых панелей с разными настройками, как в этой теме: http://help.forum2x2.ru/t29875-topic smile

Мне бы хотелось чтобы на форуме было 5 таких панелей, но с разными настройками внешнего вида. :88:

Сама разобраться так и не смогла, так как мои попытки увенчались крахом, поэтому прошу помощи у более профессиональных специалистов. wink

Заранее спасибо. d_daisy


Последний раз редактировалось: Кардинал Мишель Картер (Чт 28 Мар - 16:28), всего редактировалось 1 раз(а)
avatar
Сказочник Зазеркалья
Дизайнер
Дизайнер

Мужчина

Сообщения : 3533
Возраст : 26
Регистрация : 2012-11-16
Благодарности : 690

Без предупреждений

http://help.forum2x2.ru

Вернуться к началу Перейти вниз

Re: Как сделать несколько панелей с разными настройками ?

Сообщение автор Домовой в Чт 28 Мар - 7:36

такие панельки в паре работают не адекватно.
Могу предложить как у меня на форуме
Таких можно приляпать сколь угодно
avatar
Домовой
 

Мужчина

Сообщения : 6805
Возраст : 93
Регистрация : 2010-01-30
Благодарности : 3231

Без предупреждений

Вернуться к началу Перейти вниз

Re: Как сделать несколько панелей с разными настройками ?

Сообщение автор Сказочник Зазеркалья в Чт 28 Мар - 13:56

@Домовой пишет:такие панельки в паре работают не адекватно.
Могу предложить как у меня на форуме
Таких можно приляпать сколь угодно

Если как у вас можно будет много сделать панелей, то это хорошо. Домовой плиз подскажите где и что нужно сделать. smile
avatar
Сказочник Зазеркалья
Дизайнер
Дизайнер

Мужчина

Сообщения : 3533
Возраст : 26
Регистрация : 2012-11-16
Благодарности : 690

Без предупреждений

http://help.forum2x2.ru

Вернуться к началу Перейти вниз

Re: Как сделать несколько панелей с разными настройками ?

Сообщение автор Домовой в Чт 28 Мар - 16:21

на примере пять штук.
http://domovoy.forumy2x2.ru/

в шаблон
Код:
<!--первый блок-->
<script type="text/javascript">
jQuery(document).ready(function(){
 jQuery('.onebutton').click(function(){
    jQuery(this).parent().children('div.oneCont').toggle('normal');
      return false;
    });
  });
</script>

<!--блок с содержимым_1-->
<div class="one"  style="position:fixed; left: 2px; top:100px;"><div class="onebutton"><img src="ссылка на кнопку первого блока" title="Панель 1" alt=""></div><div style="display: none; position: absolute;" class="oneCont">
СОДЕРЖИМОЕ
</div></div>
<!--конец первого блока-->


<!--второй блок-->
<script type="text/javascript">
jQuery(document).ready(function(){
 jQuery('.twobutton').click(function(){
    jQuery(this).parent().children('div.twoCont').toggle('normal');
      return false;
    });
  });
</script>

<!--блок с содержимым_2-->
<div class="two"  style="position:fixed; left: 2px; top:150px;"><div class="twobutton"><img src="ссылка на кнопку второго блока" title="Панель 2" alt=""></div><div style="display: none; position: absolute;" class="twoCont">
СОДЕРЖИМОЕ
</div></div>
<!--конец второго блока-->


<!--третий блок-->
<script type="text/javascript">
jQuery(document).ready(function(){
 jQuery('.threebutton').click(function(){
    jQuery(this).parent().children('div.threeCont').toggle('normal');
      return false;
    });
  });
</script>

<!--блок с содержимым_3-->
<div class="three"  style="position:fixed; left: 2px; top:200px;">
<div class="threebutton"><img src="ссылка на кнопку третьего блока" border="0" title="Панель 3" />
</div>
<div style="display: none; position: absolute;" class="threeCont">
СОДЕРЖИМОЕ
</div></div>
<!--конец третьего блока-->


<!--четвёртый блок-->
<script type="text/javascript">
jQuery(document).ready(function(){
 jQuery('.fourbutton').click(function(){
    jQuery(this).parent().children('div.fourCont').toggle('normal');
      return false;
    });
  });
</script>

<!--блок с содержимым_4-->
<div class="four"  style="position:fixed; left: 2px; top:250px;">
<div class="fourbutton"><img src="ссылка на кнопку четвёртого блока" border="0" title="Панель 4" />
</div>
<div style="display: none; position: absolute;" class="fourCont">
СОДЕРЖИМОЕ
</div></div>
<!--конец четвёртого блока-->


<!--пятый блок-->
<script type="text/javascript">
jQuery(document).ready(function(){
 jQuery('.fivebutton').click(function(){
    jQuery(this).parent().children('div.fiveCont').toggle('normal');
      return false;
    });
  });
</script>

<!--блок с содержимым_5-->
<div class="five"  style="position:fixed; left: 2px; top:300px;">
<div class="fivebutton"><img src="ссылка на кнопку пятого блока" border="0" title="Панель 5" />
</div>
<div style="display: none; position: absolute;" class="fiveCont">
СОДЕРЖИМОЕ
</div></div>
<!--конец пятого блока-->
в CSS

Код:
/*оформление первого блока*/
.one {
position:relative;
width:40px; /*ширина кнопки*/
height:40px; /*высота кнопки*/
}

.one div.oneCont {
position:absolute;
width:350px !important; /*ширина блока с содержимым*/
height:200px !important; /*высотаблока с содержимым*/
background-color:#fff !important; /*фон окна*/
z-index:999;
margin-top:5px; /*отступ окна от кнопки*/
margin-left:1px; /*отступ окна от левого края*/
border:1px solid #0000FF; /*толщина, стиль и цвет рамки окна*/
-moz-border-radius:3px;
-khtml-border-radius:3px;
-webkit-border-radius:3px;
border-radius:3px;
padding:5px;
}

/*оформление второго блока*/
.two {
position:relative;
width:40px; /*ширина кнопки*/
height:40px; /*высота кнопки*/
}

.two div.twoCont {
position:absolute;
width:350px !important; /*ширина блока с содержимым*/
height:200px !important; /*высотаблока с содержимым*/
background-color:#FFA500 !important; /*фон окна*/
z-index:999;
margin-top:5px; /*отступ окна от кнопки*/
margin-left:1px; /*отступ окна от левого края*/
border:1px solid #0000FF; /*толщина, стиль и цвет рамки окна*/
-moz-border-radius:3px;
-khtml-border-radius:3px;
-webkit-border-radius:3px;
border-radius:3px;
padding:5px;
}

/*оформление третьего блока*/
.three {
position:relative;
width:40px; /*ширина кнопки*/
height:40px; /*высота кнопки*/
}

/*блок с содержимым*/
.three div.threeCont {
position:absolute;
width:350px !important; /*ширина блока с содержимым*/
height:200px !important; /*высотаблока с содержимым*/
background-color:#6495ED !important; /*фон окна*/
z-index:999;
margin-top:5px; /*отступ окна от кнопки*/
margin-left:1px; /*отступ окна от левого края*/
border:1px solid #0000FF; /*толщина, стиль и цвет рамки окна*/
-moz-border-radius:3px;
-khtml-border-radius:3px;
-webkit-border-radius:3px;
border-radius:3px;
padding:5px;
}

/*оформление четвёртого блока*/
.four {
position:relative;
width:40px; /*ширина кнопки*/
height:40px; /*высота кнопки*/
}

/*блок с содержимым*/
.four div.fourCont {
position:absolute;
width:350px !important; /*ширина блока с содержимым*/
height:200px !important; /*высотаблока с содержимым*/
background-color:#32CD32 !important; /*фон окна*/
z-index:999;
margin-top:5px; /*отступ окна от кнопки*/
margin-left:1px; /*отступ окна от левого края*/
border:1px solid #0000FF; /*толщина, стиль и цвет рамки окна*/
-moz-border-radius:3px;
-khtml-border-radius:3px;
-webkit-border-radius:3px;
border-radius:3px;
padding:5px;
}

/*оформление пятого блока*/
.five {
position:relative;
width:40px; /*ширина кнопки*/
height:40px; /*высота кнопки*/
}

/*блок с содержимым*/
.five div.fiveCont {
position:absolute;
width:350px !important; /*ширина блока с содержимым*/
height:200px !important; /*высотаблока с содержимым*/
background-color:#FA8072 !important; /*фон окна*/
z-index:999;
margin-top:5px; /*отступ окна от кнопки*/
margin-left:1px; /*отступ окна от левого края*/
border:1px solid #0000FF; /*толщина, стиль и цвет рамки окна*/
-moz-border-radius:3px;
-khtml-border-radius:3px;
-webkit-border-radius:3px;
border-radius:3px;
padding:5px;
}
avatar
Домовой
 

Мужчина

Сообщения : 6805
Возраст : 93
Регистрация : 2010-01-30
Благодарности : 3231

Без предупреждений

Вернуться к началу Перейти вниз

Re: Как сделать несколько панелей с разными настройками ?

Сообщение автор Сказочник Зазеркалья в Чт 28 Мар - 16:27

@Домовой пишет:на примере пять штук.
http://domovoy.forumy2x2.ru/

в шаблон
Спойлер:
Код:
<!--первый блок-->
<script type="text/javascript">
jQuery(document).ready(function(){
 jQuery('.onebutton').click(function(){
    jQuery(this).parent().children('div.oneCont').toggle('normal');
      return false;
    });
  });
</script>

<!--блок с содержимым_1-->
<div class="one"  style="position:fixed; left: 2px; top:100px;"><div class="onebutton"><img src="ссылка на кнопку первого блока" title="Панель 1" alt=""></div><div style="display: none; position: absolute;" class="oneCont">
СОДЕРЖИМОЕ
</div></div>
<!--конец первого блока-->


<!--второй блок-->
<script type="text/javascript">
jQuery(document).ready(function(){
 jQuery('.twobutton').click(function(){
    jQuery(this).parent().children('div.twoCont').toggle('normal');
      return false;
    });
  });
</script>

<!--блок с содержимым_2-->
<div class="two"  style="position:fixed; left: 2px; top:150px;"><div class="twobutton"><img src="ссылка на кнопку второго блока" title="Панель 2" alt=""></div><div style="display: none; position: absolute;" class="twoCont">
СОДЕРЖИМОЕ
</div></div>
<!--конец второго блока-->


<!--третий блок-->
<script type="text/javascript">
jQuery(document).ready(function(){
 jQuery('.threebutton').click(function(){
    jQuery(this).parent().children('div.threeCont').toggle('normal');
      return false;
    });
  });
</script>

<!--блок с содержимым_3-->
<div class="three"  style="position:fixed; left: 2px; top:200px;">
<div class="threebutton"><img src="ссылка на кнопку третьего блока" border="0" title="Панель 3" />
</div>
<div style="display: none; position: absolute;" class="threeCont">
СОДЕРЖИМОЕ
</div></div>
<!--конец третьего блока-->


<!--четвёртый блок-->
<script type="text/javascript">
jQuery(document).ready(function(){
 jQuery('.fourbutton').click(function(){
    jQuery(this).parent().children('div.fourCont').toggle('normal');
      return false;
    });
  });
</script>

<!--блок с содержимым_4-->
<div class="four"  style="position:fixed; left: 2px; top:250px;">
<div class="fourbutton"><img src="ссылка на кнопку четвёртого блока" border="0" title="Панель 4" />
</div>
<div style="display: none; position: absolute;" class="fourCont">
СОДЕРЖИМОЕ
</div></div>
<!--конец четвёртого блока-->


<!--пятый блок-->
<script type="text/javascript">
jQuery(document).ready(function(){
 jQuery('.fivebutton').click(function(){
    jQuery(this).parent().children('div.fiveCont').toggle('normal');
      return false;
    });
  });
</script>

<!--блок с содержимым_5-->
<div class="five"  style="position:fixed; left: 2px; top:300px;">
<div class="fivebutton"><img src="ссылка на кнопку пятого блока" border="0" title="Панель 5" />
</div>
<div style="display: none; position: absolute;" class="fiveCont">
СОДЕРЖИМОЕ
</div></div>
<!--конец пятого блока-->
в CSS

Код:
/*оформление первого блока*/
.one {
position:relative;
width:40px; /*ширина кнопки*/
height:40px; /*высота кнопки*/
}

.one div.oneCont {
position:absolute;
width:350px !important; /*ширина блока с содержимым*/
height:200px !important; /*высотаблока с содержимым*/
background-color:#fff !important; /*фон окна*/
z-index:999;
margin-top:5px; /*отступ окна от кнопки*/
margin-left:1px; /*отступ окна от левого края*/
border:1px solid #0000FF; /*толщина, стиль и цвет рамки окна*/
-moz-border-radius:3px;
-khtml-border-radius:3px;
-webkit-border-radius:3px;
border-radius:3px;
padding:5px;
}

/*оформление второго блока*/
.two {
position:relative;
width:40px; /*ширина кнопки*/
height:40px; /*высота кнопки*/
}

.two div.twoCont {
position:absolute;
width:350px !important; /*ширина блока с содержимым*/
height:200px !important; /*высотаблока с содержимым*/
background-color:#FFA500 !important; /*фон окна*/
z-index:999;
margin-top:5px; /*отступ окна от кнопки*/
margin-left:1px; /*отступ окна от левого края*/
border:1px solid #0000FF; /*толщина, стиль и цвет рамки окна*/
-moz-border-radius:3px;
-khtml-border-radius:3px;
-webkit-border-radius:3px;
border-radius:3px;
padding:5px;
}

/*оформление третьего блока*/
.three {
position:relative;
width:40px; /*ширина кнопки*/
height:40px; /*высота кнопки*/
}

/*блок с содержимым*/
.three div.threeCont {
position:absolute;
width:350px !important; /*ширина блока с содержимым*/
height:200px !important; /*высотаблока с содержимым*/
background-color:#6495ED !important; /*фон окна*/
z-index:999;
margin-top:5px; /*отступ окна от кнопки*/
margin-left:1px; /*отступ окна от левого края*/
border:1px solid #0000FF; /*толщина, стиль и цвет рамки окна*/
-moz-border-radius:3px;
-khtml-border-radius:3px;
-webkit-border-radius:3px;
border-radius:3px;
padding:5px;
}

/*оформление четвёртого блока*/
.four {
position:relative;
width:40px; /*ширина кнопки*/
height:40px; /*высота кнопки*/
}

/*блок с содержимым*/
.four div.fourCont {
position:absolute;
width:350px !important; /*ширина блока с содержимым*/
height:200px !important; /*высотаблока с содержимым*/
background-color:#32CD32 !important; /*фон окна*/
z-index:999;
margin-top:5px; /*отступ окна от кнопки*/
margin-left:1px; /*отступ окна от левого края*/
border:1px solid #0000FF; /*толщина, стиль и цвет рамки окна*/
-moz-border-radius:3px;
-khtml-border-radius:3px;
-webkit-border-radius:3px;
border-radius:3px;
padding:5px;
}

/*оформление пятого блока*/
.five {
position:relative;
width:40px; /*ширина кнопки*/
height:40px; /*высота кнопки*/
}

/*блок с содержимым*/
.five div.fiveCont {
position:absolute;
width:350px !important; /*ширина блока с содержимым*/
height:200px !important; /*высотаблока с содержимым*/
background-color:#FA8072 !important; /*фон окна*/
z-index:999;
margin-top:5px; /*отступ окна от кнопки*/
margin-left:1px; /*отступ окна от левого края*/
border:1px solid #0000FF; /*толщина, стиль и цвет рамки окна*/
-moz-border-radius:3px;
-khtml-border-radius:3px;
-webkit-border-radius:3px;
border-radius:3px;
padding:5px;
}

Домовой огромное вам спасибо!!! yahoo 26 38
Сейчас буду крутить настройки. 39
Темку можно закрывать. thank
avatar
Сказочник Зазеркалья
Дизайнер
Дизайнер

Мужчина

Сообщения : 3533
Возраст : 26
Регистрация : 2012-11-16
Благодарности : 690

Без предупреждений

http://help.forum2x2.ru

Вернуться к началу Перейти вниз

Предыдущая тема Следующая тема Вернуться к началу


 
Права доступа к этому форуму:
Вы не можете отвечать на сообщения