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

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

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


Вы здесь » Единый форум поддержки » Корзина » Таблицы на заказ (12)


Таблицы на заказ (12)

Сообщений 121 страница 140 из 1000

121

Кофеман написал(а):

иначе потом будете спрашивать как их туда поставить и подгонять самостоятельно.

я то подгоню, разберусь, у меня только с java скриптами туго,  просто пометьте куда вставлять ссылку на кнопку, и ссылку на кнопку при наведении. могу сказать шинирина кнопки 184, высота 40. просто у меня еще не готов окончательный вариант.

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

0

122

Эйфория Cделайте предварительный макет кнопок - тупо заскриншотить и обрезать текст  в топике под нужный размер кнопок -делаецо за 10мин(просто подгонять без изо -действительно сложно - да и кайф от создания таблицы не тот - теряецо ощущение готового продукта (а иных стимулов Вы и предложить не можете

Эйфория написал(а):

надеюсь я доступно изьясняюсь...

:glasses: Доступно... минимальные затраты собственных усилий, не пособствуя помогающему

Отредактировано Deff (Пт, 22 Июл 2011 14:25:43)

+1

123

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

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

окей, постараюсь способсвовать

вот кнопки без наведения
кнопка 1
кнопка 2
кнопка 3
кнопка 4
кнопка 5

вот они же при наведении
1
2
3
4
5

вот фон для контейнера
еще раз вид меню

вариант 1: контент(окно с текстом) открыт по умолчанию, плавно сменяется на другой при нажатии на соответсвующую кнопку.
вариант 2: контент плавно открываеться при наведении на соответсвующую кнопку, при отведении мышки скрывается.

если сделаете два варианта буду поклоняться вам до конца жизни как великому мастеру)

пс: а да, повсторю ссылку на форум http://fortresscity.rolka.su/ (пробник)

Отредактировано Эйфория (Пт, 22 Июл 2011 15:39:27)

0

124

Шрифт обычный, черный. На сам прямоугольник сделать эту картинку. Ну на всё остальное как "новости" и т.д. поставить эти картинки:
http://s55.radikal.ru/i150/1107/02/02b6d1b14520.jpg
http://s002.radikal.ru/i198/1107/fc/6885164d7838.jpg
http://s005.radikal.ru/i212/1107/dd/ff231c9d78bf.jpg
http://i075.radikal.ru/1107/6e/d81ff1fc26ad.jpg
http://s41.radikal.ru/i091/1107/06/00d0a8abe81f.jpg
http://s009.radikal.ru/i310/1107/8b/78a84c48ab49.jpg

А вот и сам прямоугольник:
http://s004.radikal.ru/i207/1107/c7/4fa956de74c2.jpg

Отредактировано Marike (Пт, 22 Июл 2011 15:57:02)

0

125

Уважаемые мастера, не могли бы Вы сделать для меня таблицу?)
http://savepic.ru/2849621.jpg

0

126

Marike

Полностью заменяете код
В HTML-верх

Код:
<style>
#menu {width: 98%; margin-bottom: -4px; }	
#menu span {
padding: 0; 
margin: 0!important;
text-decoration: none;
}

#submenu {
padding: 7px;
height: 382px;
text-align: center;
font-size: 13px;
width: 96%;
}

.submenutext {
display: none; 
margin-top: 4px;
height: 370px;
}
</style>

В Объявление

Код:
<center>

<table width="741" cellspacing="0" cellpadding="0" border="0"><tbody>
<tr>
	<td align="center">
<!-- кнопки меню -->
<div id="menu">
<span alt=#sm1 "style="cursor: pointer;"><img src="http://s55.radikal.ru/i150/1107/02/02b6d1b14520.jpg" alt="" border="0"></span>
	<span alt=#sm2 "style="cursor: pointer;"><img src="http://s002.radikal.ru/i198/1107/fc/6885164d7838.jpg" alt="" border="0"></span>
	<span alt=#sm3 "style="cursor: pointer;"><img src="http://s005.radikal.ru/i212/1107/dd/ff231c9d78bf.jpg" alt="" border="0"></span>
	<span alt=#sm4 "style="cursor: pointer;"><img src="http://i075.radikal.ru/1107/6e/d81ff1fc26ad.jpg" alt="" border="0"></span>
	<span alt=#sm5 "style="cursor: pointer;"><img src="http://s009.radikal.ru/i310/1107/8b/78a84c48ab49.jpg" alt="" border="0"></span>
	<span alt=#sm6 "style="cursor: pointer;"><img src="http://s41.radikal.ru/i091/1107/06/00d0a8abe81f.jpg" alt="" border="0"></span>
</div>
<!-- конец кнопок меню -->
	</td>
</tr>
<tr>
	<td id="MenuTxT"  align="center" valign="top" height="394" style="background: url(http://s004.radikal.ru/i207/1107/c7/4fa956de74c2.jpg) no-repeat center; width:741px; height:394px;">
<div id="submenu" align="center"> 
     <div id="sm1" class="submenutext" style="display:block;">

Контент Администрация

</div>
     <div id="sm2" class="submenutext">
<div style="width: 100%; height: 368px; overflow: auto; overflow-x: hidden; padding: 1px;">
Контент Новости прокрутка появится автоматически
</div>
</div>
     <div id="sm3" class="submenutext">

Контент Акции

</div>
     <div id="sm4" class="submenutext">

Контент Топы

</div>
     <div id="sm5" class="submenutext">

Контент Партнерство

</div>
     <div id="sm6" class="submenutext">

Контент Важные ссылки

</div>

</div>
	</td>
</tr></tbody>
</table>


</center>
<!-- Скрипт переключения содержимого меню -->
<script type="text/javascript">
$(document).ready(function() {
$("td.#MenuTxT div.submenutext").hide();
<!--$(".tabs span:first").addClass("active").show(); -->
$("td.#MenuTxT div.submenutext:first").show();
$("div.#menu span").click(function() {
    $("div.#menu span").removeClass("tabactive");
    $(this).addClass("tabactive");
    $("td.#MenuTxT div.submenutext").hide();
    var activeDiv = $(this).attr("alt");
    $("div."+activeDiv).fadeIn();
    return false; });
});
</script>

0

127

Эйфория

В окно HTML-верх

Код:
<!--  Стиль меню -->
<style>

.pusto {
height: 53px;
width: 191px;
margin-top: -10px;
}

#menu {
height: 55px; 
width: 100%;
padding: 0!important;
z-index:1000;
}	

#menu span {
color:transparent;
margin: 0!important;
background:transparent top center no-repeat;
font-size:40px;
}


#submenu {
padding: 0;
height: 300px;
text-align: center;
font-size: 12px;
width: 100%;
}

.submenutext {
display: none; 
height: 296px!important;
padding: 1px;
}

/* Картинки пассивных кнопок */
#menu span.but1{background-image:url(http://forumupload.ru/uploads/000f/d0/93/2242-1.gif);margin-left:-10px!important;}
#menu span.but2{background-image:url(http://forumupload.ru/uploads/000f/d0/93/2242-2.gif);margin-left:-4px!important;}
#menu span.but3{background-image:url(http://forumupload.ru/uploads/000f/d0/93/2242-3.gif);margin-left:-5px!important;}
#menu span.but4{background-image:url(http://forumupload.ru/uploads/000f/d0/93/2242-4.gif);margin-left:-9px!important;}
#menu span.but5{background-image:url(http://forumupload.ru/uploads/000f/d0/93/2242-5.gif);margin-left:-9px!important;}

/* Картинки активных кнопок */
#menu span.but1.tabactive{background-image:url(http://forumupload.ru/uploads/000f/cb/c8/34-1.gif);}
#menu span.but2.tabactive{background-image:url(http://forumupload.ru/uploads/000f/cb/c8/34-2.gif);}
#menu span.but3.tabactive{background-image:url(http://forumupload.ru/uploads/000f/cb/c8/34-3.gif);}
#menu span.but4.tabactive{background-image:url(http://forumupload.ru/uploads/000f/cb/c8/34-4.gif);}
#menu span.but5.tabactive{background-image:url(http://forumupload.ru/uploads/000f/cb/c8/34-5.gif);}
</style>

В Объявление

Код:
<center><table style="width: 100%;">
 <tbody>
  <tr>
   <td style="height: 60px;">
    <div id="menu"> 
<span class="but1" alt=#sm1 "style="cursor: pointer;"><img src="http://savepic.org/1675590.png" class="pusto" /></span>
<span class="but2" alt=#sm2 "style="cursor: pointer;"><img src="http://savepic.org/1675590.png" class="pusto" /></span>
<span class="but3" alt=#sm3 "style="cursor: pointer;"><img src="http://savepic.org/1675590.png" class="pusto" /></span>
<span class="but4" alt=#sm4 "style="cursor: pointer;"><img src="http://savepic.org/1675590.png" class="pusto" /></span>
<span class="but5" alt=#sm5 "style="cursor: pointer;"><img src="http://savepic.org/1675590.png" class="pusto" /></span>
           </div>
   </td>
  </tr>
  <tr>
   <td id="MenuTxT"  align="center" valign="top">
    <div id="submenu" align="center"> 
     <div id="sm1" class="submenutext" style="display:block;">
<br/><br/>
Контент 1-й кнопки
</div>
     <div id="sm2" class="submenutext"><br /><br />

Контент 2-й кнопки
</div>
     <div id="sm3" class="submenutext"><br /><br />
Контент 3-й кнопки
</div>
     <div id="sm4" class="submenutext"><br /><br />
Контент 4-й кнопки
</div>
     <div id="sm5" class="submenutext"><br /><br />
Контент 5-й кнопки
</div>

</div>
   </td>
</tr>
 </tbody>
</table></center>

<script type="text/javascript">
$(document).ready(function() {
$("td.#MenuTxT div.submenutext").hide();
<!--$(".tabs span:first").addClass("active").show(); -->
$("td.#MenuTxT div.submenutext:first").show();
$("div.#menu span").click(function() {
    $("div.#menu span").removeClass("tabactive");
    $(this).addClass("tabactive");
    $("td.#MenuTxT div.submenutext").css({"z-index":"-1;"})
    var activeDiv = $(this).attr("alt");
    $("div."+activeDiv).css({"z-index":"1"})
    $("td.#MenuTxT div.submenutext").hide(1200);
    $("div."+activeDiv).show(2200);
    return false; });
});
</script>

Расположение кнопок подогнано под Ваш пробник, который Вы указали.

Эйфория написал(а):

вариант 2: контент плавно открываеться при наведении на соответсвующую кнопку, при отведении мышки скрывается.

Содержимое должно открываться в виде выпадающего окна? Если нет - тогда просите Deff'a написать скрипт.

0

128

Спасибо)

Отредактировано Marike (Вс, 24 Июл 2011 16:37:16)

0

129

И прислал меня за таблицкой Дефф...
Собственно, нужна табличка с бекграундом и ячейками, куда можно засунуть картинки 100х100 + ячейки, куда можно впихнуть надписи. Это конечно воплотимо. Но все это надо впихнуть в пост  :insane:  Вроде как для магазина подарков.
1. Эскиз:
http://i048.radikal.ru/1107/d0/ca38539d5bb4.jpg
Фон:
http://i048.radikal.ru/1107/81/860bf8a87b94.jpg
Каким должен быть результат:
http://s39.radikal.ru/i085/1107/65/a26ca89e54ef.jpg
(В качествен картинок можно впихнуть что угодно размеров 100х100)
2. Адрес форума
http://sim-arts.ru/
3. Дополнительно
Никаких фишек не надо.

0

130

Кофеман
примного благодарна)

Кофеман написал(а):

Содержимое должно открываться в виде выпадающего окна

да, именно как вы сказали

0

131

Здравствуйте,  очень нуждаюсь в вашей помощи.
Простите, что такой кривой эскиз, но...)
http://i072.radikal.ru/1107/71/d4538d3e2c0et.jpg
Надеюсь, что он понятный. Желательно, чтобы границ таблицы не было видно.
Ссылка: Дворцовые игры

0

132

Здравствуйте.) Очень понравилась таблица Owllow( пост 5), установила. но есть одна проблема: фон содержания кнопок всплывающего меню не такого цвета, какого нужно. Как это исправить?

0

133

Кофеман
эм...у меня маленькая проблемка с таблицей
http://fortresscity.rolka.su/
при замене контента кнопки, один текст который должен заменить, сьезжает вниз, не очень аккуратно смотриться, можно сделать  что бы текст был на одном уровне и при смене? а в идеале еще бы  и фон контенту задать, пробовала вставить, но он у меня по центру не хочет вставать, да и вместе с текстом движется при смене. возможно его неподвижным сделать?
вот код вверх.

Код:
<!--  Стиль меню -->
<style>

.pusto {
height: 100px;
width: 200px;
margin-top: -10px;
}

#menu {
height: 55px; 
width: 100%;
padding: 0!important;
z-index:1000;
}	

#menu span {
color:transparent;
margin: 0!important;
background:transparent top center no-repeat;
font-size:50px;
}


#submenu {
padding: 0;
height: 100px;
text-align: center;
font-size: 12px;
width: 100%;
}

.submenutext {
display: none; 
height: 100px!important;
padding: 1px;
}

/* Картинки пассивных кнопок */
#menu span.but1{background-image:url(http://forumupload.ru/uploads/000f/d0/93/4145-1.gif);margin-left:-10px!important;}
#menu span.but2{background-image:url(http://forumupload.ru/uploads/000f/d0/93/4145-2.gif);margin-left:-4px!important;}
#menu span.but3{background-image:url(http://forumupload.ru/uploads/000f/d0/93/4145-3.gif);margin-left:-5px!important;}
#menu span.but4{background-image:url(http://forumupload.ru/uploads/000f/d0/93/4145-4.gif);margin-left:-9px!important;}


/* Картинки активных кнопок */
#menu span.but1.tabactive{background-image:url(http://forumupload.ru/uploads/000f/d0/93/4146-1.gif);}
#menu span.but2.tabactive{background-image:url(http://forumupload.ru/uploads/000f/d0/93/4146-2.gif);}
#menu span.but3.tabactive{background-image:url(http://forumupload.ru/uploads/000f/d0/93/4146-3.gif);}
#menu span.but4.tabactive{background-image:url(http://forumupload.ru/uploads/000f/d0/93/4146-4.gif);}
</style>

в объявление тот же что дали...

Код:
<center><table style="width: 100%;">
 <tbody>
  <tr>
   <td style="height: 60px;">
    <div id="menu"> 
<span class="but1" alt=#sm1 "style="cursor: pointer;"><img src="http://savepic.org/1675590.png" class="pusto" /></span>
<span class="but2" alt=#sm2 "style="cursor: pointer;"><img src="http://savepic.org/1675590.png" class="pusto" /></span>
<span class="but3" alt=#sm3 "style="cursor: pointer;"><img src="http://savepic.org/1675590.png" class="pusto" /></span>
<span class="but4" alt=#sm4 "style="cursor: pointer;"><img src="http://savepic.org/1675590.png" class="pusto" /></span>
<span class="but5" alt=#sm5 "style="cursor: pointer;"><img src="http://savepic.org/1675590.png" class="pusto" /></span>
           </div>
   </td>
  </tr>
  <tr>
   <td id="MenuTxT"  align="center" valign="top">
    <div id="submenu" align="center"> 
     <div id="sm1" class="submenutext" style="display:block;">
<br/><br/>
Контент 1-й кнопки
</div>
     <div id="sm2" class="submenutext"><br /><br />

Контент 2-й кнопки
</div>
     <div id="sm3" class="submenutext"><br /><br />
Контент 3-й кнопки
</div>
     <div id="sm4" class="submenutext"><br /><br />
Контент 4-й кнопки

</div>
   </td>
</tr>
 </tbody>
</table></center>

<script type="text/javascript">
$(document).ready(function() {
$("td.#MenuTxT div.submenutext").hide();
<!--$(".tabs span:first").addClass("active").show(); -->
$("td.#MenuTxT div.submenutext:first").show();
$("div.#menu span").click(function() {
    $("div.#menu span").removeClass("tabactive");
    $(this).addClass("tabactive");
    $("td.#MenuTxT div.submenutext").css({"z-index":"-1;"})
    var activeDiv = $(this).attr("alt");
    $("div."+activeDiv).css({"z-index":"1"})
    $("td.#MenuTxT div.submenutext").hide(1200);
    $("div."+activeDiv).show(2200);
    return false; });
});
</script>

Отредактировано Эйфория (Пн, 25 Июл 2011 21:35:31)

0

134

Эйфория Добавьте красное, и

Контент 4-й кнопки

</div>
</div>
   </td>
</tr>
</tbody>
</table></center>

И поправьте скрипт ( при вашем стиле не получицо плавное движение без съезжания

Код:
<script type="text/javascript">
$(document).ready(function() {
$("td.#MenuTxT div.submenutext").hide();
<!--$(".tabs span:first").addClass("active").show(); -->
$("td.#MenuTxT div.submenutext:first").show();
$("div.#menu span").click(function() {
    $("div.#menu span").removeClass("tabactive");
    $(this).addClass("tabactive");
    $("td.#MenuTxT div.submenutext").css({"z-index":"-1;"})
    var activeDiv = $(this).attr("alt");
    $("div."+activeDiv).css({"z-index":"1"})
    $("td.#MenuTxT div.submenutext").hide();
    $("div."+activeDiv).show();
    return false; });
});
</script>

Общий фон для всего контента  задаем так:

<style>
#MenuTxT{
background-image: url(http://savepic.org/2024625.jpg)!important;
background-repeat:no-repeat;
background-position:50% 50%!important;
}
</style>

Отредактировано Deff (Вт, 26 Июл 2011 04:22:31)

0

135

Здравствуйте) Хотелось бы заказать таблицу, но, предчувствуя, как я коряво буду её описывать, я заранее нашла пример этой самой таблицы.
1. Эскиз:
пример
Фон:
прозрачный
2. Адрес форума
http://asgard.rolevaya.ru/
3. Дополнительно
Нужно шесть вкладок.
Всё) Заранее спасибо)

0

136

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

при вашем стиле не получицо плавное движение без съезжания

тогда может получится эффект Исчезновения, при замене одного текста на другой?

Отредактировано Эйфория (Вт, 26 Июл 2011 14:35:58)

0

137

1) Помогите разделить контент на три части
2) Можно ли для каждого контента свою фоновую картинку?

Код:
<style>	
#menu span {
padding: 7px 15px 7px; 
margin-right: 5px;
margin: 10px 0;
width: 100px;
text-decoration: none;
}
#menu .tabactive {
color: #2662DF;
background: #F9F1DD;
}

#submenu {
padding: 5px;
height: 300px;
text-align: left;
font-size: 12px;
width: 720px;
}

.submenutext {
text-align: center;
background: цвет общего фона;
position:absolute;
width:100%;
max-width: 720px;
display: none; 
height: 260px!important;
}
</style>

<script type="text/javascript">
$(document).ready(function() {
$("td.#MenuTxT div.submenutext").hide();
<!--$(".tabs span:first").addClass("active").show(); -->
$("td.#MenuTxT div.submenutext:first").show();
$("div.#menu span").click(function() {
    $("div.#menu span").removeClass("tabactive");
    $(this).addClass("tabactive");
    $("td.#MenuTxT div.submenutext").css({"z-index":"-1;"})
    var activeDiv = $(this).attr("alt");
    $("div."+activeDiv).css({"z-index":"1"})
    $("td.#MenuTxT div.submenutext").hide(1200);
    $("div."+activeDiv).show(2200);
    return false; });
});
</script>
Код:
<center><table style="width: 780px;">
 <tbody>
  <tr>
   <td align="center">
    <div id="menu"> <b>
<span alt=#sm1 "style="cursor: pointer;">Кнопка 1</span>
<span alt=#sm2 "style="cursor: pointer;">Кнопка 2</span>
<span alt=#sm3 "style="cursor: pointer;">Кнопка 3</span>
<span alt=#sm4 "style="cursor: pointer;">Кнопка 4</span>
<span alt=#sm5 "style="cursor: pointer;">Кнопка 5</span>
           </b>
    </div>
   </td>
  </tr>
  <tr align="left">
   <td id="MenuTxT"  valign="top"  style="height: 260px;">
    <div id="submenu" width="100%"> 
     <div id="sm1" class="submenutext" style="display:block;">
<br/><br/>
Контент 1-й кнопки
</div>
     <div id="sm2" class="submenutext"><br /><br />

Контент 2-й кнопки
</div>
     <div id="sm3" class="submenutext"><br /><br />
Контент 3-й кнопки
</div>
     <div id="sm4" class="submenutext"><br /><br />
Контент 4-й кнопки
</div>
     <div id="sm5" class="submenutext"><br /><br />
Контент 5-й кнопки
</div>

</div>
   </td>
</tr>
 </tbody>
</table></center>

Форум

0

138

Большое спасибо за помощь,разобралась. снимаю заказ.

Отредактировано Эйфория (Ср, 27 Июл 2011 22:44:50)

0

139

Доброй ночи!

сделайте пожалуйсто так
очень прошу так сделать

чтобы у меня выдвигалось именно так как нарисованно, надписи прошу сделать чтобы было хорошо видно на чёрном фоне

сайтhttp://shamankeng.4bb.ru

заранее спасибо  :flag:

Отредактировано Graf Dracula (Чт, 28 Июл 2011 02:11:02)

0

140

Доброго времени суток) Обращусь к вам за помощью, надеюсь, что не сильно намудрила с эскизом.
таблица вот сюда
http://fatefinal.ru/

эскиз 1: общий
эскиз 2: подробно

4 верхних кнопки будут картинками, так что просьба сделать их прозрачными и без границ.
соотношение между окном и картинкой : 750 пикселей в ширину картинка, остальное второй блок.

заранее большое спасибо)

0


Вы здесь » Единый форум поддержки » Корзина » Таблицы на заказ (12)