Жду ответа про фон
🎧 Подкаст «НЕТЕРОЛЕВЫЕ»
Рассказываем и обсуждаем Форумные Ролевые Игры (ФРПГ).
Telegram Обсудить
ForumD.ru - Дизайн, графика, скрипты, техническая поддержка для форумов и сайтов |
Привет, Гость! Войдите или зарегистрируйтесь.
Вы здесь » ForumD.ru - Дизайн, графика, скрипты, техническая поддержка для форумов и сайтов » Заказать дизайн, графику или скрипты » Заказать верстку и скрипты » Таблица
Жду ответа про фон
вот этот? http://s1.uploads.ru/t/z0St9.jpg
Оки (Хотя ссылка на сайт с дизайном интересней...
Лан - ставлю данный фон под картинки
Будет часа через два
Отредактировано Deff (21.05.13 12:21)
Deff
Конкретно под эти кнопки я раздумала делать дизайн,так что потом буду делать другие тыкалки)Это я эти дала,чтобы вас не задерживать)
Нелл ну и лан, будут проблемы при установке других - отпишитесь
Deff
Хорошо)Вы и так столько возились со мной!*___*
В HTML верх:
<!-- Стиль меню таблицы в объявлении --> <style type="text/css"> /**************************************** Таблица с переключаемыми Вкладками ****************************************/ #tab2,#tab2*{ paddibg:0; margin:0; } #tab2 { background:transparent url(http://s1.uploads.ru/QjV4E.jpg) 0 0 no-repeat; height:594px; width:800px; } #tab2,#tab2 td{ border:none 0 transparent!important; border-collapse:collapse; } #tab2 td.content { width:544px; } img[data^="tab"]{ cursor:pointer; height:100%; border:none 0 transparent!important; } .tab-content { display:none; width:80%; height:226px; color:#483119; overflow-y:auto; scrollbar-face-color: #A3622F; scrollbar-highlight-color: #FFFFFF; scrollbar-3dlight-color: #999999; scrollbar-shadow-color: #990066; scrollbar-darkshadow-color: #000000; scrollbar-arrow-color: #DBAA83; scrollbar-track-color: #C18B67; } </style> <script type="text/javascript"> $.fn.switch_tabs = function() { var tbl = this,knopK = $("img[data^='tab']",tbl); knopK.each(function(){ var arr = $(this).attr('data').split(","); $(this).css("background-image","url("+arr[1]+")") }); knopK.css("background-position","120% 10000px") knopK.css("background-repeat","no-repeat") knopK.click(function(){ knopK.removeClass('active'); $(this).addClass('active'); var arr = $(this).attr('data').split(","); tbl.css("background-image","url("+arr[1]+")") $(".tab-content",tbl).hide(); $("#"+arr[0]+"",tbl).show(); }); } </script>
В Объявление:
<div align=center> <table id="tab2" class="tbl-0" border="0"> <tr> <td class="content" align=center> <!-- Контейнер контента 1-й кнопки --> <div id="tab-1" class="tab-content" style="display:block; scrollbar-face-color: #A3622F; scrollbar-highlight-color: #FFFFFF; scrollbar-3dlight-color: #999999; scrollbar-shadow-color: #990066; scrollbar-darkshadow-color: #000000; scrollbar-arrow-color: #DBAA83; scrollbar-track-color: #C18B67;"> Контент 1-й кнопки<br /> Контент 1-й кнопки<br /> Контент 1-й кнопки<br /> Контент 1-й кнопки<br /> Контент 1-й кнопки<br /> Контент 1-й кнопки<br /> Контент 1-й кнопки<br /> Контент 1-й кнопки<br /> Контент 1-й кнопки<br /> Контент 1-й кнопки<br /> Контент 1-й кнопки<br /> Контент 1-й кнопки<br /> Контент 1-й кнопки<br /> Контент 1-й кнопки<br /> Контент 1-й кнопки<br /> Контент 1-й кнопки<br /> Контент 1-й кнопки<br /> Контент 1-й кнопки<br /> Контент 1-й кнопки<br /> Контент 1-й кнопки<br /> Контент 1-й кнопки<br /> Контент 1-й кнопки<br /> Контент 1-й кнопки<br /> Контент 1-й кнопки<br /> </div> <!-- Контейнер контента 2-й кнопки --> <div id="tab-2" class="tab-content" style="scrollbar-face-color: #A3622F; scrollbar-highlight-color: #FFFFFF; scrollbar-3dlight-color: #999999; scrollbar-shadow-color: #990066; scrollbar-darkshadow-color: #000000; scrollbar-arrow-color: #DBAA83; scrollbar-track-color: #C18B67;"> Контент 2-й кнопки<br /> Контент 2-й кнопки<br /> Контент 2-й кнопки<br /> Контент 2-й кнопки<br /> Контент 2-й кнопки<br /> Контент 2-й кнопки<br /> Контент 2-й кнопки<br /> Контент 2-й кнопки<br /> Контент 2-й кнопки<br /> Контент 2-й кнопки<br /> Контент 2-й кнопки<br /> Контент 2-й кнопки<br /> Контент 2-й кнопки<br /> Контент 2-й кнопки<br /> Контент 2-й кнопки<br /> Контент 2-й кнопки<br /> Контент 2-й кнопки<br /> Контент 2-й кнопки<br /> Контент 2-й кнопки<br /> Контент 2-й кнопки<br /> Контент 2-й кнопки<br /> Контент 2-й кнопки<br /> Контент 2-й кнопки<br /> Контент 2-й кнопки<br /> </div> <!-- Контейнер контента 3-й кнопки --> <div id="tab-3" class="tab-content" style="scrollbar-face-color: #A3622F; scrollbar-highlight-color: #FFFFFF; scrollbar-3dlight-color: #999999; scrollbar-shadow-color: #990066; scrollbar-darkshadow-color: #000000; scrollbar-arrow-color: #DBAA83; scrollbar-track-color: #C18B67;"> Контент 3-й кнопки<br /> Контент 3-й кнопки<br /> Контент 3-й кнопки<br /> Контент 3-й кнопки<br /> Контент 3-й кнопки<br /> Контент 3-й кнопки<br /> Контент 3-й кнопки<br /> Контент 3-й кнопки<br /> Контент 3-й кнопки<br /> Контент 3-й кнопки<br /> Контент 3-й кнопки<br /> Контент 3-й кнопки<br /> Контент 3-й кнопки<br /> Контент 3-й кнопки<br /> Контент 3-й кнопки<br /> Контент 3-й кнопки<br /> Контент 3-й кнопки<br /> Контент 3-й кнопки<br /> Контент 3-й кнопки<br /> Контент 3-й кнопки<br /> Контент 3-й кнопки<br /> Контент 3-й кнопки<br /> Контент 3-й кнопки<br /> Контент 3-й кнопки<br /> </div> <!-- Контейнер контента 4-й кнопки --> <div id="tab-4" class="tab-content" style="scrollbar-face-color: #A3622F; scrollbar-highlight-color: #FFFFFF; scrollbar-3dlight-color: #999999; scrollbar-shadow-color: #990066; scrollbar-darkshadow-color: #000000; scrollbar-arrow-color: #DBAA83; scrollbar-track-color: #C18B67;"> Контент 4-й кнопки<br /> Контент 4-й кнопки<br /> Контент 4-й кнопки<br /> Контент 4-й кнопки<br /> Контент 4-й кнопки<br /> Контент 4-й кнопки<br /> Контент 4-й кнопки<br /> Контент 4-й кнопки<br /> Контент 4-й кнопки<br /> Контент 4-й кнопки<br /> Контент 4-й кнопки<br /> Контент 4-й кнопки<br /> Контент 4-й кнопки<br /> Контент 4-й кнопки<br /> Контент 4-й кнопки<br /> Контент 4-й кнопки<br /> Контент 4-й кнопки<br /> Контент 4-й кнопки<br /> Контент 4-й кнопки<br /> Контент 4-й кнопки<br /> Контент 4-й кнопки<br /> Контент 4-й кнопки<br /> Контент 4-й кнопки<br /> Контент 4-й кнопки<br /> Контент 4-й кнопки </div> </td> <td class="butt" valign=center align=left> <!-- Секция кнопок --> <img width="238" style="height:110px;margin-top:14px;" data="tab-1,http://s1.uploads.ru/QjV4E.jpg" src="/i/blank.gif" class="active"/> <div style="position:absolute;width:170px;height:230px;margin-left:40px;margin-top:-12px;"><img width=170 style="box-shadow: 0px 4px 18px #000;border:solid 5px #A5A28E;" src="https://forumavatars.ru/img/avatars/0000/14/1c/22142-1353993647.png"/></div> <img width="238" style="height:90px;margin-top:232px;" data="tab-2,http://s1.uploads.ru/GEHRU.jpg" src="/i/blank.gif"/> </td> </tr> <tr> </td> <td align=left colspan=2 class="butt" valign=center height=130> <!-- Секция кнопок --> <img width="170" style="margin-left:80px;" data="tab-3,http://s1.uploads.ru/86p7W.jpg" src="/i/blank.gif"/> <img width="170" style="margin-left:17px" data="tab-4,http://s1.uploads.ru/lTpiC.jpg" src="/i/blank.gif"/> </td> </tr> </table><script>$("#tab2").switch_tabs()</script><!--//End/-switch Tabs --></div>
авик вставляется в объявлении в строке
<img width=170 style="box-shadow: 0px 4px 18px #000;border:solid 5px #A5A28E;" src="https://forumavatars.ru/img/avatars/0000/14/1c/22142-1353993647.png"/>
Отредактировано Deff (21.05.13 16:32)
Deff
немного не то,что я хотела,но это еще лучше.Спасибо!)
Нелл
Поправил - букву упустил
Поправил - букву упустил
где?
И тут это...я разродилась на нормальную графику,но кое что чуть не совпадает...Можно подправить?ричунок (чувак с тачкой) ниже опустить,чтобы кнопку не закрывал и в табло уже немного текст...
http://testnell.rolka.su/
Вы здесь » ForumD.ru - Дизайн, графика, скрипты, техническая поддержка для форумов и сайтов » Заказать дизайн, графику или скрипты » Заказать верстку и скрипты » Таблица