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

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


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

Мы в социальных сетях



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

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


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

Пожалуйста, не регистрируйтесь на этом форуме с электронными адресами mail.ru, bk.ru, inbox.ru, list.ru - вам может не прийти письмо со ссылкой активации!
Вы можете воспользоваться адресами типа yandex.ru, rambler.ru, gmail.com и т.д.
Интересные решения
Быстрый переход к сервисам: JPG-Net Видео фоторедактор Транслит
Видео-туториалы
Настройка шапки форума
Категории и подфорумы - 1
Создание портала
Модули
Виджеты
Как присваивать награды
Выброс кубиков
Pop-up для входа на форум
Настроение в профиле

Помогите разобраться со выплывающей панелью...

Страница 1 из 2 1, 2  Следующий

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

Решено Помогите разобраться со выплывающей панелью...

Сообщение автор NaYami в Вт 12 Июл - 22:12

Помогите разобраться с панелью, что бы сунуть меню/навигацию под всплывающую панель как ТУТ! но так что бы структура html осталась примерно такой же.

HTML
Код:
<div id="slidedown_top"></div> <!-- slidedown_top -->
      <div id="slidedown_content">
 <div class="content">
  <div class="block">
  <img src="footerAuthor.gif"/><br/>

  <p>A passionate web designer, developer who keens to contribute to web development industry.</p>
  <p>Feel free to say hi to me, or follow me on twitter. </p>
  </div>
  <div class="block">
  <img src="footerTwitter.gif"/><br/>
  <ul>
  <li>I have a new inspiration using easing method, stay tuned!</li>
  <li>Dock menu with jQuery! pretty cool huh...</li>
  </ul>
  </div>
  <div class="block">
  <img src="footerPartner.gif"/><br/>
  <ul>
  <li>Smashing Magazine</li>
  <li>Vandelay Design</li>
  <li>Sixrevision</li>
  <li>CSS Mania</li>
  <li>Web Designer Depot</li>
  <li>Queness</li>
  </ul>
  </div>
  <div class="clear"></div>
  </div> <!-- content -->
 
  <div class="footer">
  </div> <!-- footer -->
 
  </div> <!-- slidedown_content -->

CSS
Код:
<style>
  body {
  margin:0;
  padding:0
  }
#slidedown_top {
  height: 70px;
  background-color:#666;
  }
#slidedown_bottom {
  position: absolute;
  width: 100%;
  height:100%;
  background-color:#666;
  }
slidedown_content {
  position: absolute;
  width: 100%;
  height: 250px;
  top: -205px;
  text-align:center;
  background:url(bg.gif) repeat-x 0 bottom;
  z-index:999;
  }
#slidedown_content .content {
  margin:0 auto;
  width:830px;
  height:205px;
  }
/* Styles for content */
#slidedown_content .content .block {
  float:left;
  width:250px;
  padding:0 4px 0 4px;
  margin: 0 4px 0 4px;
text-align:left;
  font-family:georgia;
  font-size:11px;
  color:#ccc;
  }
slidedown_content .footer {
  height:40px;
  }
#slidedown_content .content li {
  padding:0;
  margin:4px 0
  }
.clear {clear:both}
  </style>

jQuery
Код:
<script type="text/javascript" src="js/jquery-1.3.1.min.js"></script>
  <script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
<script>
$(document).ready(function() {
 var top = '-' + $('#slidedown_content .content').css('height');
  var easing = 'easeOutBounce';
 
  $('#slidedown_top').mouseover(function() {
  $('#slidedown_content').animate({'top' : 0}, {queue:false, duration:1000, easing: easing});
  });
 
  $('#slidedown_bottom').mouseover(function() {
  $('#slidedown_content').animate({'top' : top}, {queue:false, duration:500, easing: easing});
  });
});
</script>


Последний раз редактировалось: NaYami (Вс 17 Июл - 21:46), всего редактировалось 2 раз(а)

NaYami
 
 

Сообщения : 140
Карма : Без предупреждений
Благодарности : 1
Регистрация : 2011-02-24

http://teneoris.forum2x2.org 382525916

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

Решено Re: Помогите разобраться со выплывающей панелью...

Сообщение автор Альберт Вескер в Ср 13 Июл - 7:44

Охтыж, сколько там не лазил, такого я не находил. Или это из последнего добавленного, NaYami?

Альберт Вескер
 
 

Пол : Мужчина
Сообщения : 684
Возраст : 26
Карма : Без предупреждений
Благодарности : 41
Регистрация : 2011-04-03

http://www.re-role.com

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

Решено Re: Помогите разобраться со выплывающей панелью...

Сообщение автор NaYami в Ср 13 Июл - 17:36

нет

Пожалуйста помогите

NaYami
 
 

Сообщения : 140
Карма : Без предупреждений
Благодарности : 1
Регистрация : 2011-02-24

http://teneoris.forum2x2.org 382525916

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

Решено Re: Помогите разобраться со выплывающей панелью...

Сообщение автор Sunnyta в Ср 13 Июл - 22:06

Вы хотите так сделать на Портальной страничке или на всех? wink

Sunnyta
 
 

Сообщения : 1604
Карма : Без предупреждений
Благодарности : 63
Регистрация : 2008-03-20

http://www.sun-place.com/

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

Решено Re: Помогите разобраться со выплывающей панелью...

Сообщение автор Альберт Вескер в Ср 13 Июл - 22:17

NaYami (22:15:44 13/07/2011)
На всех...))

Альберт Вескер
 
 

Пол : Мужчина
Сообщения : 684
Возраст : 26
Карма : Без предупреждений
Благодарности : 41
Регистрация : 2011-04-03

http://www.re-role.com

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

Решено Re: Помогите разобраться со выплывающей панелью...

Сообщение автор Sunnyta в Ср 13 Июл - 22:32

1. придется найти по Поиску этого форума (вариант своего меню - с кнопками или без них?) и вписать его вместо того, написанного в 1 посте, как вариант есть тут - http://help.forum2x2.ru/t17776-topic?highlight=%F1%E2%EE%E5+%EC%E5%ED%FE
2. убить стандартное меню, скрипт надо вставить в шаблон оверал-футер и портал-боди, но можно попробовать и новым способом вставки скриптов Javascript, как описано в этой теме - http://help.forum2x2.ru/t18577p30-topic#148968 (если сработает - отпишитесь)
Код:
<script type="text/javascript">
amenu = document.getElementsByTagName('a');
for (i=0;i<amenu.length;i++){
if(amenu[i].className == "mainmenu"){
amenu[i].style.display = "none";
}
}
</script>

Sunnyta
 
 

Сообщения : 1604
Карма : Без предупреждений
Благодарности : 63
Регистрация : 2008-03-20

http://www.sun-place.com/

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

Решено Re: Помогите разобраться со выплывающей панелью...

Сообщение автор NaYami в Чт 14 Июл - 10:01

не работает
я не хочу менять структуру html... но с меню стало понятнее, спасибо.

помогите с панелью.. она не правильно работает... у меня по крайне мере

NaYami
 
 

Сообщения : 140
Карма : Без предупреждений
Благодарности : 1
Регистрация : 2011-02-24

http://teneoris.forum2x2.org 382525916

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

Решено Re: Помогите разобраться со выплывающей панелью...

Сообщение автор Sunnyta в Чт 14 Июл - 18:07

@NaYami пишет:не работает
я не хочу менять структуру html... но с меню стало понятнее, спасибо.

помогите с панелью.. она не правильно работает... у меня по крайне мере
Где смотреть неработающий пример?

Sunnyta
 
 

Сообщения : 1604
Карма : Без предупреждений
Благодарности : 63
Регистрация : 2008-03-20

http://www.sun-place.com/

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

Решено Re: Помогите разобраться со выплывающей панелью...

Сообщение автор NaYami в Чт 14 Июл - 19:38


NaYami
 
 

Сообщения : 140
Карма : Без предупреждений
Благодарности : 1
Регистрация : 2011-02-24

http://teneoris.forum2x2.org 382525916

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

Решено Re: Помогите разобраться со выплывающей панелью...

Сообщение автор Sunnyta в Чт 14 Июл - 20:55

ссылку на сайт дайте 24

Sunnyta
 
 

Сообщения : 1604
Карма : Без предупреждений
Благодарности : 63
Регистрация : 2008-03-20

http://www.sun-place.com/

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

Решено Re: Помогите разобраться со выплывающей панелью...

Сообщение автор NaYami в Чт 14 Июл - 21:39

я это уже убрала, потому что из за этого фон пропадает...
http://teneoris.forum2x2.org/

NaYami
 
 

Сообщения : 140
Карма : Без предупреждений
Благодарности : 1
Регистрация : 2011-02-24

http://teneoris.forum2x2.org 382525916

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

Решено Re: Помогите разобраться со выплывающей панелью...

Сообщение автор Sunnyta в Чт 14 Июл - 23:11

а в CSS вы где-нибудь прописали картинку для фона?

Sunnyta
 
 

Сообщения : 1604
Карма : Без предупреждений
Благодарности : 63
Регистрация : 2008-03-20

http://www.sun-place.com/

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

Решено Re: Помогите разобраться со выплывающей панелью...

Сообщение автор NaYami в Чт 14 Июл - 23:47

конечно

NaYami
 
 

Сообщения : 140
Карма : Без предупреждений
Благодарности : 1
Регистрация : 2011-02-24

http://teneoris.forum2x2.org 382525916

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

Решено Re: Помогите разобраться со выплывающей панелью...

Сообщение автор Мизраил в Пн 15 Авг - 5:55

[неработающий код удален]

Мизраил
 
 

Пол : Мужчина
Сообщения : 262
Возраст : 20
Карма : 2 предупреждения
Благодарности : 106
Регистрация : 2011-03-08

618061180

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

Решено Re: Помогите разобраться со выплывающей панелью...

Сообщение автор NaYami в Пн 15 Авг - 14:09

не работает... вообще никаких изменений

NaYami
 
 

Сообщения : 140
Карма : Без предупреждений
Благодарности : 1
Регистрация : 2011-02-24

http://teneoris.forum2x2.org 382525916

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

Решено Re: Помогите разобраться со выплывающей панелью...

Сообщение автор Альберт Вескер в Пн 15 Авг - 14:12

Ничего не работает. Вы на тестовике пробовали?

Альберт Вескер
 
 

Пол : Мужчина
Сообщения : 684
Возраст : 26
Карма : Без предупреждений
Благодарности : 41
Регистрация : 2011-04-03

http://www.re-role.com

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

Решено Re: Помогите разобраться со выплывающей панелью...

Сообщение автор Dana Domirani в Вт 16 Авг - 14:53


Сразу предупреждаю: тестировалось на форуме без рекламы.

1. Редактируем шаблон overall_header (Верхняя часть страницы)

1.1 Ищем тег </head>

Перед ним добавляем скрипты:
Код:
<script type="text/javascript" src="http://yandex.st/jquery/easing/1.3/jquery.easing.js"></script>

<script>
$(document).ready(function() {
   var top = '-' + $('#slidedown_content .content').css('height');
   var easing = 'easeInSine';
   $('#slidedown_top').mouseover(function() {
      $('#slidedown_content').animate({'top' : 0}, {queue:false, duration:1000, easing: easing});
   });
   $('#slidedown_bottom').mouseover(function() {
      $('#slidedown_content').animate({'top' : top}, {queue:false, duration:500, easing: easing});
   });
});
</script>


1.2 Ищем тег <body> (он чуть ниже) и после него добавляем само меню:

Код:
<div id="slidedown_top"></div> <!-- slidedown_top -->

<div id="slidedown_content">

   <div class="content">

      <div class="block">
         <p>Приветствие<br/>
         Здесь любой текст приветствия, истории форма, его правил и сложившихся традиций. Одним словом, что угодно.
         </p>
         <p>Навигация </p>
         <ul>
            <li><a href="/portal">Портал</a></li>
            <li><a href="/t1-topic">Тема дня</a></li>
         </ul>
      </div>

      <div class="block">
         <ul>
            <li>Объявление 1!</li>
            <li>Объявление 2...</li>
         </ul>
      </div>

      <div class="block">
         <ul>
            <li>Список 1 < </li>
            <li>Список 2 < </li>
            <li>Список 3 < </li>
            <li>Список 4 < </li>
            <li>Список 5 < </li>
            <li>Список 6 < </li>
         </ul>      
      </div>

      <div class="clear"></div>

   </div> <!-- content -->

   <div class="footer"></div> <!-- footer -->
   
</div> <!-- slidedown_content -->

<div id="slidedown_bottom">


1.3 В самом низу, перед тегом </body> добавляем тег </div>



1.4 Содержимое, т.е. текст, находящийся внутри тегов <div class="block">...</div> изменяем как душе угодно.

После этого сохраняем шаблон, публикуем (!)

2. Добавляем в CSS настройки:

Код:
body {
margin:0;
padding:0;
background: #666;
}

#slidedown_top {
height: 60px;
background-color: transparent;
}

#slidedown_bottom {
position: absolute;
width: 100%;
height:100%;
}

#slidedown_content {
position: absolute;
width: 100%;
height: 250px;
top: -205px;
text-align:center;
z-index: 999;
background: #666 url('http://i44.servimg.com/u/f44/16/54/26/99/bg10.gif') repeat-x left bottom;
}

#slidedown_content .content {
margin:0 auto;
width:830px;
height:205px;
background-color: transparent;
color: #fff;
}

/* Настройки блоков с содержимым */

#slidedown_content .content .block {
float:left;
width:250px;
padding:0 4px 0 4px;
margin: 0 4px 0 4px;
text-align:left;
font-family:georgia;
font-size:11px;
color:#ccc;
}

#slidedown_content .footer {
height:40px;
}

#slidedown_content .content li {
padding:0;
margin:4px 0
}

.clear {
clear:both
}

Сохраняем.


Где находится CSS?
Па > Оформление > Цвета > Каскадная таблица стилей CSS


Где искать основные шаблоны?
ПА > Оформление > Шаблоны > Общие настройки


Где находится раздел для подключения скриптов
ПА > Модули > Управление кодами Javascript



Dana Domirani
Администратор
Администратор

Пол : Женщина
Сообщения : 21911
Возраст : 31
Место обитания : СПб
Карма : Без предупреждений
Благодарности : 8761
Регистрация : 2008-04-18

http://poltergeist-legacy.com/

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

Решено Re: Помогите разобраться со выплывающей панелью...

Сообщение автор NaYami в Вт 16 Авг - 18:13

До вставки

После

как исправить?

NaYami
 
 

Сообщения : 140
Карма : Без предупреждений
Благодарности : 1
Регистрация : 2011-02-24

http://teneoris.forum2x2.org 382525916

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

Решено Re: Помогите разобраться со выплывающей панелью...

Сообщение автор Dana Domirani в Вт 16 Авг - 18:18

Могу предположить, что не был поставлен закрывающий див (пункт 1.3)

Или проблема в наличие рекламы (если таковая имеется).


Где находится CSS?
Па > Оформление > Цвета > Каскадная таблица стилей CSS


Где искать основные шаблоны?
ПА > Оформление > Шаблоны > Общие настройки


Где находится раздел для подключения скриптов
ПА > Модули > Управление кодами Javascript



Dana Domirani
Администратор
Администратор

Пол : Женщина
Сообщения : 21911
Возраст : 31
Место обитания : СПб
Карма : Без предупреждений
Благодарности : 8761
Регистрация : 2008-04-18

http://poltergeist-legacy.com/

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

Решено Re: Помогите разобраться со выплывающей панелью...

Сообщение автор NaYami в Вт 16 Авг - 18:26

див поставила.. может проблема в том.. что у меня есть задний фон?

NaYami
 
 

Сообщения : 140
Карма : Без предупреждений
Благодарности : 1
Регистрация : 2011-02-24

http://teneoris.forum2x2.org 382525916

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

Решено Re: Помогите разобраться со выплывающей панелью...

Сообщение автор Dana Domirani в Вт 16 Авг - 18:28

Фоновое изображение мешать не должно.


Где находится CSS?
Па > Оформление > Цвета > Каскадная таблица стилей CSS


Где искать основные шаблоны?
ПА > Оформление > Шаблоны > Общие настройки


Где находится раздел для подключения скриптов
ПА > Модули > Управление кодами Javascript



Dana Domirani
Администратор
Администратор

Пол : Женщина
Сообщения : 21911
Возраст : 31
Место обитания : СПб
Карма : Без предупреждений
Благодарности : 8761
Регистрация : 2008-04-18

http://poltergeist-legacy.com/

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

Решено Re: Помогите разобраться со выплывающей панелью...

Сообщение автор NaYami в Вт 16 Авг - 18:49

все работает, спасибо огромное!!!

NaYami
 
 

Сообщения : 140
Карма : Без предупреждений
Благодарности : 1
Регистрация : 2011-02-24

http://teneoris.forum2x2.org 382525916

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

Решено Re: Помогите разобраться со выплывающей панелью...

Сообщение автор Dana Domirani в Вт 16 Авг - 18:50

Не за что!


Где находится CSS?
Па > Оформление > Цвета > Каскадная таблица стилей CSS


Где искать основные шаблоны?
ПА > Оформление > Шаблоны > Общие настройки


Где находится раздел для подключения скриптов
ПА > Модули > Управление кодами Javascript



Dana Domirani
Администратор
Администратор

Пол : Женщина
Сообщения : 21911
Возраст : 31
Место обитания : СПб
Карма : Без предупреждений
Благодарности : 8761
Регистрация : 2008-04-18

http://poltergeist-legacy.com/

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

Решено Re: Помогите разобраться со выплывающей панелью...

Сообщение автор Альберт Вескер в Вт 16 Авг - 19:57

Шедеврально!!

Альберт Вескер
 
 

Пол : Мужчина
Сообщения : 684
Возраст : 26
Карма : Без предупреждений
Благодарности : 41
Регистрация : 2011-04-03

http://www.re-role.com

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

Решено Re: Помогите разобраться со выплывающей панелью...

Сообщение автор NaYami в Вт 16 Авг - 20:19

Помогите правильно прописать эти ссылки, что бы они у всех правильно отображались...
сделать как тут.. см.код
Код:
<a href="/portal">Портал</a>


Сообщения в профиле - http://teneoris.forum2x2.org/u2wall
Контакты - http://teneoris.forum2x2.org/u2contact
Лист персонажа - http://teneoris.forum2x2.org/u2rpg и лист персонажа развернутый



NaYami
 
 

Сообщения : 140
Карма : Без предупреждений
Благодарности : 1
Регистрация : 2011-02-24

http://teneoris.forum2x2.org 382525916

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

Решено Re: Помогите разобраться со выплывающей панелью...

Сообщение автор Альберт Вескер в Вт 16 Авг - 20:43

И еще вопрос, как в навигации (та что в панели) сделать её по правам доступа как и стандартную? То есть гости видят одни ссылки, но поле регистрации увидят остальные ссылки - ЛС, Профиль, и прочие.

Альберт Вескер
 
 

Пол : Мужчина
Сообщения : 684
Возраст : 26
Карма : Без предупреждений
Благодарности : 41
Регистрация : 2011-04-03

http://www.re-role.com

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

Решено Re: Помогите разобраться со выплывающей панелью...

Сообщение автор Альберт Вескер в Ср 17 Авг - 10:49

Простите за непонимание, но можно подробнее, по пунктам - что куда?

Альберт Вескер
 
 

Пол : Мужчина
Сообщения : 684
Возраст : 26
Карма : Без предупреждений
Благодарности : 41
Регистрация : 2011-04-03

http://www.re-role.com

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

Решено Re: Помогите разобраться со выплывающей панелью...

Сообщение автор NaYami в Ср 17 Авг - 14:54

@Альберт Вескер пишет:И еще вопрос, как в навигации (та что в панели) сделать её по правам доступа как и стандартную? То есть гости видят одни ссылки, но поле регистрации увидят остальные ссылки - ЛС, Профиль, и прочие.
А вот меня это все еще интересует...

NaYami
 
 

Сообщения : 140
Карма : Без предупреждений
Благодарности : 1
Регистрация : 2011-02-24

http://teneoris.forum2x2.org 382525916

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

Решено Re: Помогите разобраться со выплывающей панелью...

Сообщение автор Dana Domirani в Ср 17 Авг - 14:57

Есть такая тема - http://help.forum2x2.ru/t17776-topic#143749


Где находится CSS?
Па > Оформление > Цвета > Каскадная таблица стилей CSS


Где искать основные шаблоны?
ПА > Оформление > Шаблоны > Общие настройки


Где находится раздел для подключения скриптов
ПА > Модули > Управление кодами Javascript



Dana Domirani
Администратор
Администратор

Пол : Женщина
Сообщения : 21911
Возраст : 31
Место обитания : СПб
Карма : Без предупреждений
Благодарности : 8761
Регистрация : 2008-04-18

http://poltergeist-legacy.com/

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

Решено Re: Помогите разобраться со выплывающей панелью...

Сообщение автор NaYami в Ср 17 Авг - 15:45

Но как?..я не знаю.. совсем...
@Dana Domirani пишет:Есть такая тема - http://help.forum2x2.ru/t17776-topic#143749
а тут получилось как-то странно..
я в профиле, но видны ссылки, как для гостя...

NaYami
 
 

Сообщения : 140
Карма : Без предупреждений
Благодарности : 1
Регистрация : 2011-02-24

http://teneoris.forum2x2.org 382525916

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

Страница 1 из 2 1, 2  Следующий

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


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