сентябрь Нарисуте- заскриншотьте и поправьте, - как должна выглядеть эта вкладка таблички в итоге - а то долго бум
Карусельный скрипт: Объединеный Инфо-Блок и Мини-Фотогаллерея
Сообщений 41 страница 60 из 60
Поделиться42Пн, 6 Июн 2011 22:05:56
Deff
Просто колонки как-то зафиксировать..
http://xmages.net/storage/10/1/0/5/2/up … 168e6e.jpg
Поделиться43Пн, 6 Июн 2011 22:26:39
Просто колонки как-то зафиксировать..http://xmages.net/storage/10/1/0/5/2/up … 168e6e.jpg
Набейте все 4 колонки - я поправлю
Поделиться45Пн, 6 Июн 2011 23:59:04
сентябрь Гм - на форуме - я имею ввиду - код я так увижу (пока там ток три >
Отредактировано Deff (Вт, 7 Июн 2011 00:01:26)
Поделиться46Вт, 7 Июн 2011 14:38:33
Deff
Ну там и четыре набито. Последние колонки: акции, полезные ссылки.
Поделиться47Вт, 7 Июн 2011 14:58:05
<center><!--============== Fotogallere/Information block =========== --> <style> /*#announcement_1 .span{visibility: hidden;}*/ </style> <style> /*======== Экранная Таблица =========*/ #Tab_01 { position:relative; z-index:4;/**/ border-collapse:collapse; border:#999395 0px solid!important; width:98%!important; height:269px; /*border-color:#000; */ background-image: url(); /*http://s46.radikal.ru/i112/1011/36/d7ce20ebe0a6.jpg*/ background-position:no-repeat; } #Tab_Ekr { width:98%!important; /*border:red 1px solid!important;*/ } #Tab_Ekr td { border-collapse:collapse!important; /*border:red 0px solid!important;*/ text-align:center; } #Ekr td{ height:169px!important; } #title { height:20px!important; /*border:#000 0px solid!important;*/ } #title div{ display: none; /*margin-bottom:1%;*/ position:relative; /*border:red 0px solid!important;*/ max-width:98%; font-weight:bold!important; font-size:14px!important; text-align:center; text-align:center; vertical-align:center; } #Ekr div.Num1,#Ekr div.Num2,#Ekr div.Num3,#Ekr div.Num4{ width:90%; height:167px!important; padding:2px; margin: 5px 7%; display: none; border:#7E4A4E 0px solid!important;/**/ text-align:left; } #Ekr img{ /*max-width:200px!important;*/ max-height:150px!important; display:inline; float:left; padding:3px 4px 3px 0; text-align:right; } #vmeny,#vmeny td{ background:; border:#AFA7AA 0px solid!important; } #prevnext,#prevnext td{ background:; border:#999395 0px groove!important;/**/ padding:0 65px; } /* Ограничение максимального размера превью */ /**/ #lightbox,#imageDataContainer,#hoverNav,#outerImageContainer{ max-width:900px!important; max-height:680px!important; } #lightboxImage { max-width:880px!important; max-height:694px!important; } .ScrolBlock { margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; overflow-x: hidden; overflow-y: auto; padding-bottom: 0px; padding-left: 6px; padding-right: 6px; padding-top: 0px; width: 100%; } </style> <!-- ==========УКРАШАТЕЛЬСТВА============= --> <style type="text/css"> /* Стиль первой буквы после тега <p> */ #Ekr p:first-letter,#Ekr .lipsum:first-letter,#Ekr ul li:first-child:first-letter { font-family: "Times New Roman", Times, serif!important; /* Гарнитура шрифта первой буквы */ font-size: 200% !important; /* Размер шрифта первого символа */ color: #A31B2E!important; /* Красный цвет текста */ } #Ekr ul li a{color:#5D4B4B!important; } #Ekr ul li a:hover{color:#0555D3!important; } </style> <center><table id="Tab_01" border="2" cellspacing="0" cellpadding="0"> <tbody> <tr> <!--======&&& Экраные ТАБЛИЦЫ ======= --> <td width="100%" valign="bottom" height="199" colspan="8" style="height:199px!important;"> <div id="title" alt="Блок экранных Заголовков" style="padding:0px;"> <!--======&&& Блок экранных Заголовков =================================== --> <!-- &&&"Заголовок Экран 1--> <div id="title_1" style="display: block;">ветер перемен</div> <!-- &&&"Заголовок Экран 2--> <div id="title_2" style="">ветер перемен<span style=font-weight:normal;font-size:11px;"></span></div> <!--&&&//КОНЕЦ Экранных Заголовков--> <!--========== &&&"Заголовки для Кнопок ==========--> <!-- &&&"Заголовок Кнопка 1 Администрация --> <div id="title_301" style=""><span style="text-shadow: #64625F 2px 2px 6px;color:#931829">Администрация</span></div> <!-- &&&"Заголовок Кнопка 2 Правила Форума --> <div id="title_302" style=""><span style="text-shadow: #64625F 2px 2px 6px;color:#931829">Правила Форума</span></div> <!-- &&&"Заголовок Кнопка 3 Новости КПЦ --> <div id="title_303" style=""><span style="text-shadow: #64625F 2px 2px 6px;color:#931829">Новости КПЦ</span></div> <!-- &&&"Заголовок Кнопка 4 Полезные ссылки --> <div id="title_304" style=";"><span style="text-shadow: #64625F 2px 2px 6px;color:#931829">Полезные ссылки</span></div> <!--&&&//End Блок Экранных Заголовков--></div> <table id="Tab_Ekr" align="center" width="25%" border="0" cellspacing="0" cellpadding=0"> <tbody> <tr id="Ekr"><!-- &&&"Экран-Контент --> <!-- &&&"Экран 1 --><td class="E1"> <div class="Num1" style="display: block;"><!--1Конт 1 --> <div class="ScrolBlock" style="width:220px!important;padding-left:30px; height:140px;"> <center><b>О ПРОЕКТЕ</b></center> <br>Добро пожаловать на форумную ролевую игру "". Я не буду пересказывать здесь весь сюжет ролевой, думаю, навигация в этом Вам поможет. Хочу лишь сказать, что я хотел создать атмосферу одновременно волшебства, страха и некой странности. Надеюсь, Вы оцените. Для гостей есть специальная тема, куда вы можете задавать все интересующие вас вопросы, а также занимать или придерживать роли. Вам, когда придете, я подарю счастье, честное слово! Навеки ваш Швейцар. </br> </div> <!--//End//1Конт 1 --></div> </td> <td class="E1"> <div class="Num2" style="display: block;"><!--1Конт 2 --> <div class="ScrolBlock" style="width:180px!important;padding-left:30px; height:140px;"> <center><b>НОВОСТИ</b></center> <br> Дорогие участники, прошу Вас обратить на второй выпущенный квест. Так же, хочется напомнить о первом, который все еще не закончен. Ну, ведь это же так просто поддаться порыву вдохновения. Прошу! </br> </div> <!--//End//1Конт 2 --></div> </td> <td class="E1"> <div class="Num3" style="display: block;"><!--1Конт 3 --> <div align=center class="ScrolBlock" style="width:100px!important;padding-left:30px; height:140px;"> <b>АКЦИИ</b> <br/> <b><a href="ССЫЛКА">act0</a> </br><a href="ССЫЛКА">act1</a><br><a href="ССЫЛКА">act2</a><br><a href="ССЫЛКА">act3</a></b> </div> <!--//End//1Конт 3 --></div> </td> <td class="E1"> <div class="Num4" style="display: block;"><!--1Конт 4 --> <div align=center class="ScrolBlock" style="width:100px!important;padding-left:30px; height:140px;"> <b>ПОЛЕЗНЫЕ ССЫЛКИ</b> </br><a href="ССЫЛКА">гостевая</a><br><a href="ССЫЛКА">акции</a><br><a href="ССЫЛКА">занятые внешности</a></b> </div> <!--//End//1Конт 4 --></div> </td><!-- &&&"/End/Экран 1 --> <!-- &&&"Экран 2 --><td class="E2"> <div class="Num1" style=""><!--1Конт 1 --> <img rel="lightbox" src="http://xmages.net/storage/10/1/0/f/b/upload/0947001c.jpg" width="160" /> игрок <!--//End//1Конт 1 --></div> </td> <td class="E2"> <div class="Num2" style=""><!--1Конт 2 --> <img rel="lightbox" src="http://xmages.net/storage/10/1/0/f/b/upload/0947001c.jpg" width="160" /> конкурс <!--//End//1Конт 2 --></div> </td> <td class="E2"> <div class="Num3" style=""><!--1Конт 3 --> <img rel="lightbox" src="http://xmages.net/storage/10/1/0/f/b/upload/0947001c.jpg" width="160" /> квест <!--//End//1Конт 3 --></div> </td> <td class="E2"> <div class="Num4" style=""><!--1Конт 4 --> дата и события игре <!--//End//1Конт 4 --></div> </td><!-- &&&"/End/Экран 2 --> <!-- +++++++++++++++++++++++++ ТУТ МОЖНО ДОБАВИТЬ ОЧЕРЕДНОЙ ЭКРАН === --> <!-- &&&"//End/Контент Экранов --> <!-- ======= "Экраны для встроенных Кнопок ====== --> <!-- &&&"Экран Администрация Кнопка 1--><td class="E301"> <div class="Num1" style=""><!--1Конт 1 --> <img rel="lightbox" src="http://savepic.org/989425.jpg" width="160" /> Контент1 Кнопки 1 <!--//End//1Конт 1 --></div> </td> <td class="E301"> <div class="Num2" style=""><!--1Конт 2 --> <img rel="lightbox" src="http://savepic.org/989425.jpg" width="160" /> Контент2 Кнопки 1 <!--//End//1Конт 2 --></div> </td> <td class="E301"> <div class="Num3" style=""><!--1Конт 3 --> <img rel="lightbox" src="http://savepic.org/989425.jpg" width="160" /> Контент3 Кнопки 1 <!--//End//1Конт 3 --></div> </td> <td class="E301"> <div class="Num4" style=""><!--1Конт 4 --> <img rel="lightbox" src="http://savepic.org/989425.jpg" width="160" /> Контент4 Кнопки 1 <!--//End//1Конт 4 --></div> </td><!-- &&&"/End/"Экран Администрация 1 --> <!-- &&&"Экран Правила Кнопка 2--><td class="E302"> <div class="Num1" style=""><!--2Конт 1 --> <img rel="lightbox" src="http://savepic.org/989425.jpg" width="160" /> Контент1 Кнопки 2 <!--//End//2Конт 1 --></div> </td> <td class="E302"> <div class="Num2" style=""><!--2Конт 2 --> <img rel="lightbox" src="http://savepic.org/989425.jpg" width="160" /> Контент2 Кнопки 2 <!--//End//2Конт 2 --></div> </td> <td class="E302"> <div class="Num3" style=""><!--2Конт 3 --> <img rel="lightbox" src="http://savepic.org/989425.jpg" width="160" /> Контент3 Кнопки 2 <!--//End//2Конт 3 --></div> </td> <td class="E302"> <div class="Num4" style=""><!--2Конт 4 --> <img rel="lightbox" src="http://savepic.org/989425.jpg" width="160" /> Контент4 Кнопки 2 <!--//End//1Конт 4 --></div> </td><!-- &&&"/End/Экран Правила --> <!-- &&&"Экран Новости КПЦ Кнопка 3--><td class="E303"> <div class="Num1" style=""><!--3Конт 1 --> <img rel="lightbox" src="http://savepic.org/989425.jpg" width="160" /> Контент1 Кнопки 3 <!--//End//1Конт 1 --></div> </td> <td class="E303"> <div class="Num2" style=""><!--3Конт 2 --> <img rel="lightbox" src="http://savepic.org/989425.jpg" width="160" /> Контент2 Кнопки 3 <!--//End//2Конт 2 --></div> </td> <td class="E303"> <div class="Num3" style=""><!--3Конт 3 --> <img rel="lightbox" src="http://savepic.org/989425.jpg" width="160" /> Контент3 Кнопки 3 <!--//End//3Конт 3 --></div> </td> <td class="E303"> <div class="Num4" style=""><!--3Конт 4 --> <img rel="lightbox" src="http://savepic.org/989425.jpg" width="160" /> Контент4 Кнопки 3 <!--//End//3Конт 4 --></div> </td><!-- &&&"/End/Экран Новости КПЦ --> <!-- &&&"Экран Полезные Ссылки Кнопка 4--><td class="E304"> <div class="Num1" style=""><!--4Конт 1 --> <img rel="lightbox" src="http://savepic.org/989425.jpg" width="160" /> Контент1 Кнопки 4 <!--//End//4Конт 1 --></div> </td> <td class="E304"> <div class="Num2" style=""><!--4Конт 2 --> <img rel="lightbox" src="http://savepic.org/989425.jpg" width="160" /> Контент2 Кнопки 4 <!--//End//4Конт 2 --></div> </td> <td class="E304"> <div class="Num3" style=""><!--4Конт 3 --> <img rel="lightbox" src="http://savepic.org/989425.jpg" width="160" /> Контент3 Кнопки 4 <!--//End//4Конт 3 --></div> </td> <td class="E304"> <div class="Num4" style=""><!--4Конт 4 --> <img rel="lightbox" src="http://savepic.org/989425.jpg" width="160" /> Контент4 Кнопки 4 <!--//End//4Конт 4 --></div> </td><!-- &&&"/End/Экран Полезные Ссылки --> <!-- &&&"//End/Контент Кнопок--></tr> </tbody> </table> </td> </tr> <tr id="prevnext"> <td id="prevtd" width="50%" height="23" valign="center" align="right" colspan="4"> <span class=""><img id="prev" src="http://xmages.net/storage/10/1/0/9/d/upload/c29e3190.png" /></span> </td> <td id="nexttd" width="50%" height="23" align="left" colspan=4> <span class=""><img id="next" src="http://xmages.net/storage/10/1/0/a/1/upload/561ad42a.png"/></span> </td> </tr> </tbody> </table></center> <!-- &&& Карусельный Скрипт --> <script type="text/javascript"> jQuery(document).ready(function(){ var N_max=2 // N_max - максимальное число показываемых экранов var LH=80 var L=480 // время свертывания - развертывания var i=1 jQuery('#nexttd').click(function () { // Кнопка: Следующий; document.getElementById("prev").src='http://xmages.net/storage/10/1/0/7/4/upload/fbdcce07.png ' document.getElementById("next").src='http://xmages.net/storage/10/1/0/9/3/upload/86c535bb.png ' jQuery("#title_"+i).hide(); s2 = "tr.#Ekr td.E"+i+">div.Num" if (i>=300) i=0; i++ if (i>N_max) i=1; jQuery("#title_"+i).fadeIn(L); s = "tr.#Ekr td.E"+i+">div.Num" jQuery(s2+"4").hide(); jQuery(s2+"3").hide(); jQuery(s2+"2").hide(); jQuery(s2+"1").hide(); jQuery(s+"1").fadeIn(L); jQuery(s+"2").fadeIn(L); jQuery(s+"3").fadeIn(L); jQuery(s+"4").fadeIn(L); }); jQuery('#prevtd').click(function () { // Кнопка: Предыдущий; document.getElementById("next").src='http://xmages.net/storage/10/1/0/a/1/upload/62f9fb08.png' document.getElementById("prev").src='http://xmages.net/storage/10/1/0/b/d/upload/f5355cac.png' jQuery("#title_"+i).hide(); s2 = "tr.#Ekr td.E"+i+">div.Num" i-- if (i>=300) i = 1 if (i<=0) i=N_max; jQuery("#title_"+i).fadeIn(L); s = "tr.#Ekr td.E"+i+">div.Num" jQuery(s2+"1").hide(); jQuery(s2+"2").hide(); jQuery(s2+"3").hide(); jQuery(s2+"4").hide(); jQuery(s+"4").fadeIn(L); jQuery(s+"3").fadeIn(L); jQuery(s+"2").fadeIn(L); jQuery(s+"1").fadeIn(L); }); jQuery('tr.#vmeny td>.butCont').click(function () { // Кнопки: Администрация; Правила; Новости; Навигация; document.getElementById("next").src='http://xmages.net/storage/10/1/0/a/1/upload/62f9fb08.png' document.getElementById("prev").src='http://xmages.net/storage/10/1/0/7/4/upload/fbdcce07.png ' jQuery("#title_"+i).hide(); s2 = "tr.#Ekr td.E"+i+">div.Num" i = jQuery(this).attr("id") jQuery("#title_"+i).fadeIn(L); s = "tr.#Ekr td.E"+i+">div.Num" jQuery(s2+"1").hide(); jQuery(s2+"2").hide(); jQuery(s2+"3").hide(); jQuery(s2+"4").hide(); jQuery(s+"4").fadeIn(L); jQuery(s+"3").fadeIn(L); jQuery(s+"2").fadeIn(L); jQuery(s+"1").fadeIn(L); }); }); </script> <!--============== End//Fotogallere/Info block =========== --></center>
Отредактировано Deff (Вт, 7 Июн 2011 15:02:38)
Поделиться48Вт, 7 Июн 2011 15:10:05
Deff
Спасибо, теперь все хорошо ))
И еще вопрос: можно ли менять размер картинок (у меня во втором экране)? то есть, чтобы они были не в соотношение ширина*длина, а длина меньше ширины. Где менять эти значения? Просто без них картинка растягивалась в длину.
Поделиться49Вт, 7 Июн 2011 15:13:16
были не в соотношение ширина*длина, а длина меньше ширины
не понял вопрос - нарисуйте скрин с поправками - в превью или где ? ( вроде ограничены максимальные размеры - а не пропорции, Поставьте ту картинку - что желаете - потом на живом примере спросите
Отредактировано Deff (Вт, 7 Июн 2011 15:14:07)
Поделиться50Вт, 7 Июн 2011 15:27:46
Deff
Нет, простите, пока все работает.
Мм..где-то видела, что этот самый скролл-блок сделан под фон. То есть будь то коричные цвета на форуме, то и полоса прокрутки коричневая и не выпуклая. Можно это как-то сделать в этом скрипте? Если нужен скрин-пример, могу показать.
Поделиться51Чт, 9 Июн 2011 00:14:55
Мм..где-то видела, что этот самый скролл-блок сделан под фон. То есть будь то коричные цвета на форуме, то и полоса прокрутки коричневая и не выпуклая. Можно это как-то сделать в этом скрипте? Если нужен скрин-пример, могу показать.
<div class="Num1" style="display: block;"><!--1Конт 1 -->
<div class="ScrolBlock" style="scrollbar-face-color: #A58C6D; scrollbar-highlight-color: #AF9E84; scrollbar-shadow-color: #B19F88;scrollbar-3dlight-color: #C9BCA2;scrollbar-arrow-color: #F2F0C4; scrollbar-track-color: #C9BCA2; scrollbar-darkshadow-color: #6C5840; width:220px!important;padding-left:30px; height:140px;">
Пробуйте сделать добавку синим в каждый "ScrolBlock"
Поделиться52Чт, 9 Июн 2011 12:31:22
Deff
стало так:
http://wind.rusff.ru/
Поделиться53Чт, 9 Июн 2011 12:46:19
попутный ветер Я не сказал отдельно - а
в уже проставленные теги к Вашему коду просто добавить синее!
А не выдумывать собственные элементы и разрывать тег надвое
<style="width:220px!important;padding-left:30px; height:140px;">
- такого тега в природе(HTML) не существует
Чо трудно найти соотвествующие строки с class="ScrolBlock" style="
и добавить -(*спецом же дал достаточно длинный код
добавить - значит вставить в тоже место после style=" ...
бывший код ранее просто будет идти в след за текущим
Отредактировано Deff (Чт, 9 Июн 2011 12:56:06)
Поделиться54Чт, 9 Июн 2011 12:58:57
а можно допустим сделать одну картинку в небольшой таблице чтоб она так же сменивалась на такие же размеры как и предыдущая?
Поделиться55Чт, 9 Июн 2011 13:01:38
janyst ничо не понял - приведите пару скриншотов - одно окно и второе
Поделиться56Чт, 9 Июн 2011 13:02:51
Deff
Добавила, но не окрасилось.
все правильно вроде
<div class="ScrolBlock" style="scrollbar-face-color: #A58C6D; scrollbar-highlight-color: #AF9E84; scrollbar-shadow-color: #B19F88;scrollbar-3dlight-color: #C9BCA2;scrollbar-arrow-color: #F2F0C4; scrollbar-track-color: #C9BCA2; scrollbar-darkshadow-color: #6C5840;
width:220px!important;padding-left:30px; height:140px;">
Поделиться57Чт, 9 Июн 2011 13:24:47
попутный ветер Красицо везде, кроме мозиллы > http://savepic.org/1812001.png
для мозиллы нун делать специальный крипт - этим занимацо не буду - тема оч долгая .. можно пробовать искать в инете - над этой задачей многие бились - удовлетворительных удобных для пользователя результатов -не видел
Поделиться58Чт, 9 Июн 2011 13:30:41
Deff
у меня гугл хром, но не красится..
Поделиться59Чт, 9 Июн 2011 13:34:15
попутный ветер http://www.javaportal.ru/htmlandcss/scrollbar.html
ИЕ и Опера (*в принципе 50% -60% аудитории
Отредактировано Deff (Чт, 9 Июн 2011 13:36:22)
Поделиться60Чт, 9 Июн 2011 13:54:40
Deff
ну ничего, спасибо большое *))