Автоматическая смена фона/картинки без перезагрузки страницы
2010-05-07 Дата: Пятница, 07.05.2010, 06:32 | Сообщение # 1
Аццкий кодер
Группа: Администраторы
Статус: Unknown
Автоматическая смена фона/картинки без перезагрузки страницы ... Как и написано в теме, решение на Java Script, следовательно ничего сложного ...
Данный пример меняет фон... Немного подстроив можно сменять что угодно - картинки текст ... Короче, сами решайте ..
Скриншот:
Тестовая версия ниже ... (в прикреплении ...)
Код Java Script:
Quote (Java Script )
<script type="text/javascript"> var sImg = new Array(); sImg[0]="<div style='width:95%;height:200px;background:url(/_example/rotator/psBg.gif);'><strong>«Народная примета: Если сисадмин в 09.00 утра на работе, значит он там ночевал...»</strong><hr><strong>«Народная примета v2.0: Если админ в 9:00 на рабочем месте - значит, сервер не работает...»</strong><hr><strong>«хороший секс - это такой, после которого выходят покурить даже соседи...»</strong></div>"; sImg[1]="<div style='width:95%;height:200px;background:url(/_example/rotator/psBg-b.gif);'><strong>«Не огорчаюсь, если люди меня не понимают, - огорчаюсь, если я не понимаю людей...»</strong><hr><strong>«Сообщение по ICQ: «Ты что молчишь, клавиатуру проглотил?»</strong><hr><strong>«Не говорите программисту: «Заходи, гостем будешь!», порадуйте его возможностью зайти администратором или, в крайнем случае, пользователем...»</strong></div>"; sImg[2]="<div style='width:95%;height:200px;background:url(/_example/rotator/psBg-e.gif);'><strong>«Не ошибается то, что не работает. © Windows...»</strong><hr><strong>«...Коврик для мыши совершил недопустимую операцию и будет свернут...»</strong><hr><strong>«Пешеходы бывают двух типов - шустрые и мертвые...»</strong></div>"; sImg[3]="<div style='width:95%;height:200px;background:url(/_example/rotator/psBg-g.gif);'><strong>«4 Mb - это не память. Это склероз...»</strong><hr><strong>«Win95 как самолёт - тошнит, а выйти некуда...»</strong><hr><strong>«Все знают о том, что в километре 1024 метра, но никто не догадывается, что в минуте 64 секунды...»</strong></div>"; sImg[4]="<div style='width:95%;height:200px;background:url(/_example/rotator/psBg-gb.gif);'><strong>«Глюки - лучшее средство от скуки...»<hr>«Десятиметровый ящик на попе. (10Mb Mailbox POP3)»</strong><hr><strong>«Если глюк оказался вдруг, и не друг и не враг, а баг...»</strong></div>"; sImg[5]="<div style='width:95%;height:200px;background:url(/_example/rotator/psBg-r.gif);'><strong>«Программа выполнила допустимую операцию, но по привычке будет закрыта...»</strong><hr><strong>« - Как запомнить семь цветов радуги?<br>- Каждый Оформитель Желает Знать, Где Скачивают Фотошоп...»</strong><hr><strong>«Клаву топтать - это вам не джойстиком баловаться...»</strong></div>"; sImg[6]="<div style='width:95%;height:200px;background:url(/_example/rotator/psBg-s.gif);'><strong>«Быстро и качественно изготовлю кнопки для дверных звонков в формате GIF или JPEG...»</strong><hr><strong>«Компьютер без мыши, что коммерсант без крыши...»</strong><hr><strong>«Лучше чистить мониторы Кометом. Говорят, он ещё и вирусы убивает...»</strong></div>"; sImg[7]="<div style='width:95%;height:200px;background:url(/_example/rotator/psBg-g.gif);'><strong>«Мораль: Не трогай технику и она тебя не подведёт. Резюме: Если и это не получается, прочтите, наконец, инструкцию...»</strong><hr><strong>«На Новый Год все надели разные маски: кто - зайчика, кто - лисички... И только sysadmin надел свою любимую: 255.255.255.0...»</strong><hr><strong>«Когда программист в первый раз решается напечь блинов(!?), то первый, естественно, получается комом, ну а второй - экзешником!»</strong></div>"; showImg = function(){ var el=document.getElementById("showImg"); el.innerHTML=sImg[Math.floor(Math.random()*sImg.length)]; } setInterval(showImg,8000 ); window.onload=showImg; </script>
showImg,8000 - Скорость смены контента ...
Код HTML:
Code
<div id="showImg"></div>
<div id="showImg"></div> - вставляем в нужное место сайта .... ヅ
☑ Пример .... (Автоматическая смена фона без перезагрузки страницы ... мой вариант ...)
Flesh
2011-05-03 Дата: Вторник, 03.05.2011, 21:00 | Сообщение # 2
Аццкий кодер
Группа: Администраторы
Статус: Unknown
Code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Документ без названия</title> <script type="text/javascript" src="http://s29.ucoz.net/src/u.js"></script> <link type="text/css" rel="StyleSheet" href="http://s29.ucoz.net/src/layer1.css" /> <style type="text/css"> /* StartStyle */ div.header {height:275px;background: url('ССИЛКА') no-repeat 0 0; position: left;} /* EndStyle */ </style> </head> <body> <div class="header" id="headerImg"></div> <script type="text/javascript"> var imgBg=new Array() imgBg[0]='http://likbezz.ru/_example/rotator/psBg.gif'; imgBg[1]='http://likbezz.ru/_example/rotator/psBg-e.gif'; imgBg[2]='http://likbezz.ru/_example/rotator/psBg-g.gif'; imgBg[3]='http://likbezz.ru/_example/rotator/psBg-r.gif'; imgBg[4]='http://likbezz.ru/_example/rotator/psBg-b.gif'; imgBg[5]='http://likbezz.ru/_example/rotator/psBg-gb.gif'; imgBg[6]='http://likbezz.ru/_example/rotator/psBg-s.gif'; var rnd = Math.floor(Math.random()*(imgBg.length)); $('#headerImg').css('background','url('+imgBg[rnd]+') no-repeat 0 0'); </script> </body> </html>
2011-05-03 Дата: Вторник, 03.05.2011, 21:06 | Сообщение # 3
Аццкий кодер
Группа: Администраторы
Статус: Unknown
Code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Документ без названия</title> <style type="text/css"> /* StartStyle */ div.header {height:275px;background: url('ССИЛКА') no-repeat 0 0; position: left;} /* EndStyle */ </style> </head> <body> <div class="header" id="headerImg"></div> <script type="text/javascript"> var imgBg=new Array(); imgBg[0]='http://likbezz.ru/_example/rotator/psBg.gif'; imgBg[1]='http://likbezz.ru/_example/rotator/psBg-e.gif'; imgBg[2]='http://likbezz.ru/_example/rotator/psBg-g.gif'; imgBg[3]='http://likbezz.ru/_example/rotator/psBg-r.gif'; imgBg[4]='http://likbezz.ru/_example/rotator/psBg-b.gif'; imgBg[5]='http://likbezz.ru/_example/rotator/psBg-gb.gif'; imgBg[6]='http://likbezz.ru/_example/rotator/psBg-s.gif'; var rnd = Math.floor(Math.random()*(imgBg.length)); document.getElementById('headerImg').style.background='url('+imgBg[rnd]+') no-repeat 0 0'; </script> </body> </html>
2011-11-22 Дата: Вторник, 22.11.2011, 03:20 | Сообщение # 4
Огромное спасибо за этот скрипт! Два дня искал нечто подобное. Но только у Вас нашел именно то, что работает, как положено. Скрипт просто чудесный. Чуток подредактировал под свои нужды (у меня картинки меняются по очереди, а не случайным образом) и получился идеальный вариант. То, что доктор прописал. Низкий поклон за науку и подсказку.
2011-12-08 Дата: Четверг, 08.12.2011, 17:09 | Сообщение # 5
Респект!!)) Очень вовремя нашёл ваш скрипт, именно то, что мне было надо: со случайной сменой картинок без перезагрузки страницы. Спасибо)
2011-12-08 Дата: Четверг, 08.12.2011, 18:26 | Сообщение # 6
Аццкий кодер
Группа: Администраторы
Статус: Unknown
Более “ровная” функция showImg() через setTimeout() ... - Переключает картинку только после её полной загрузки ... HTML : Code
<div id="rand_bg" style="height:97px;background:url(/_example/bg/patterns/patt8_6.jpg) repeat 0% 0%;"> </div>
JavaScript: Code
<script type="text/javascript"> function showImg(){ var imgBg=new Array() imgBg[0]='http://likbezz.ru/_example/rotator/psBg.gif'; imgBg[1]='http://likbezz.ru/_example/rotator/psBg-e.gif'; imgBg[2]='http://likbezz.ru/_example/rotator/psBg-g.gif'; imgBg[3]='http://likbezz.ru/_example/rotator/psBg-r.gif'; imgBg[4]='http://likbezz.ru/_example/rotator/psBg-b.gif'; imgBg[5]='http://likbezz.ru/_example/rotator/psBg-gb.gif'; imgBg[6]='http://likbezz.ru/_example/rotator/psBg-s.gif'; var u=imgBg[Math.floor(Math.random()*imgBg.length)],c=new Image();c.src=u; if(!c.complete){c.onload=function(){document.getElementById('rand_bg').style.background='url('+u+') repeat 0% 0%';setTimeout('showImg()',1000);}}else{document.getElementById('rand_bg').style.background='url('+u+') repeat 0% 0%';setTimeout('showImg()',1000);} };setTimeout('showImg()',1000); </script>
☑ Пример (rand_bg_1-2) ... Пример с прозрачностью: ☑ Автоматическая смена фона + прозрачность (Rand_bg 4 + opacity) ... ...
2011-12-20 Дата: Вторник, 20.12.2011, 20:14 | Сообщение # 7
Как добавить анимацию к этому скрипту ,при переключении изображений ?
2011-12-20 Дата: Вторник, 20.12.2011, 21:53 | Сообщение # 8
Гость , Quote (Гость )
Как добавить анимацию к этому скрипту ,при переключении изображений ?
К этому? - никак ... ...
2012-01-26 Дата: Четверг, 26.01.2012, 17:27 | Сообщение # 9
Сержант
Группа: Пользователи
Статус: Offline
Доброго здравия дружище. Прикольная вещица получаеться,но..... У меня стандартный дизайн 799 и слегка переделаный. Там всё на ксс. Как там сотворить такое чудо? html:
<html> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <title>$SITE_NAME$ - $MODULE_NAME$</title> <?$META_DESCRIPTION$?> <link type="text/css" rel="StyleSheet" href="/799a.css" /> </head> <body> $ADMIN_BAR$ <?if(($MODULE_ID$ != 'tests') && ($PAGE_ID$ != 'add'))?> <script type="text/javascript"> jQuery(document).ready(function(){ $(":radio").addClass('niceRadio'); jQuery(".niceRadio").each( function() { changeRadioStart(jQuery(this)); }); }); function changeRadio(el) { var el = el, input = el.find("input").eq(0); var nm=input.attr("name"); jQuery(".niceRadio input").each( function() { if(jQuery(this).attr("name")==nm) { jQuery(this).parent().removeClass("radioChecked"); } }); if(el.attr("class").indexOf("niceRadioDisabled")==-1) { el.addClass("radioChecked"); input.attr("checked", true); } return true; } function changeVisualRadio(input) { var wrapInput = input.parent(); var nm=input.attr("name"); jQuery(".niceRadio input").each( function() { if(jQuery(this).attr("name")==nm) { jQuery(this).parent().removeClass("radioChecked"); } }); if(input.attr("checked")) { wrapInput.addClass("radioChecked"); } } function changeRadioStart(el) { try { var el = el, radioName = el.attr("name"), radioId = el.attr("id"), radioChecked = el.attr("checked"), radioDisabled = el.attr("disabled"), radioTab = el.attr("tabindex"), radioValue = el.attr("value"); var radioClick = el.attr("onclick"); if (el.attr("onclick")) { radioClick = "onmouseup='button_activate();'"; } else { radioClick = "";} if(radioChecked) el.after("<span class='niceRadio radioChecked'"+radioClick+">"+ "<input type='radio'"+ "name='"+radioName+"'"+ "id='"+radioId+"'"+ "checked='"+radioChecked+"'"+ "tabindex='"+radioTab+"'"+ "value='"+radioValue+"' /></span>"); else el.after("<span class='niceRadio'"+radioClick+">"+ "<input type='radio'"+ "name='"+radioName+"'"+ "id='"+radioId+"'"+ "tabindex='"+radioTab+"'"+ "value='"+radioValue+"' /></span>"); if(radioDisabled) { el.next().addClass("niceRadioDisabled"); el.next().find("input").eq(0).attr("disabled","disabled"); } el.next().bind("mousedown", function(e) { changeRadio(jQuery(this)) }); el.next().find("input").eq(0).bind("change", function(e) { changeVisualRadio(jQuery(this)) }); if(jQuery.browser.msie) { el.next().find("input").eq(0).bind("click", function(e) { changeVisualRadio(jQuery(this)) }); } el.remove(); } catch(e) { } return true; } </script> <?endif?> $GLOBAL_AHEADER$ <div id="gametitle-block"> <div id="gametitle"></div> </div> <div id="container" <?if($MODULE_ID$ == 'forum')?>class="forum-cont"<?endif?>> <?if($MODULE_ID$ == 'forum')?> <div id="leftcol-top"></div> <div id="bad"></div> <div id="rightcol-top1"></div> <div id="rightcol-top2"></div> <div id="rightcol-top3"></div> <?endif?> <!-- <middle> --> <div id="leftcol"> <div id="leftcol-top"></div> <div id="bad"></div> <div class="sidebar"> $GLOBAL_CLEFTER$ </div> <div id="ls_bottom"></div> </div> <div id="maincol"> <div id="main-top"></div> <div id="main-middle"> <div id="main-body"> <!-- <body> -->$CONTENT$<!-- </body> --> </div> </div> <div id="main-bottom"></div> </div> <div id="rightcol"> <div id="rightcol-top1"></div> <div id="rightcol-top2"></div> <div id="rightcol-top3"></div> <div class="sidebar"> $GLOBAL_DRIGHTER$ </div> <div id="rs_bottom"></div> </div> <div style="clear: both"></div> <!-- </middle> --> </div> $GLOBAL_BFOOTER$ </body> </html>
CSS:
/*--------------------- General styles start ---------------------*/ body { margin: 0px; background:#0a0907 url('http://leg-equilibrium.clan.su/01/asmoranger_1920.jpg');background-size: 80%;background-attachment: fixed; font: 11px 'Arial'; color: #5d5d5d; text-align: center; } body table { font: 11px 'Tahoma', 'Arial'; } body a { text-decoration: none; color: #e5891c; } body a:hover { text-decoration: underline; } * {} img {border: 0px;} /*--------------------- General styles end ---------------------*/ /*--------------------- All content start ---------------------*/ /*--------------------- All content end ---------------------*/ /*--------------------- Header start ---------------------*/ #today { margin-top: 1px; color: #a86e49; background: black; font: 11px 'Tahoma', 'Arial'; float: left; padding: 0px 10px; border-radius: 2px; -moz-border-radius: 2px; } #tm { margin-top: 1px; color: #a86e49; background: black; font: bold 11px 'Tahoma', 'Arial'; float: right; padding: 0px 10px; border-radius: 2px; -moz-border-radius: 2px; text-transform: uppercase; } #tm a { color: #f8e048; } #header { clear: both; width: 1000px; height: 300px; background: url(http://leg-equilibrium.ucoz.ru/diz/bg3.jp); margin: auto; text-align: left; font: 35px/110px 'Times New Roman'; color: #fcd211; } #gametitle-block { width: 1000px; margin: auto; } /*--------------------- Header end ---------------------*/ /*--------------------- Main content start ---------------------*/ #container { width: 1000px; margin: auto; margin-top: -12px; padding: 0px; text-align: left; background: url(); } #container.forum-cont {position:relative; padding-top: 1px;} #leftcol { position: relative; float: left; width: 220px; text-align: justify; background: url(/.s/t/799/7.png); } .sidebar { margin: 10px 20px 0px 20px; width: 180px; } #maincol { /*margin: 0px 220px 0px 220px; _width: 100%; /*FOR IE*/ float: left; width: 560px; text-align: justify; padding-top: 1px; } #main-top { margin-top: 10px; width: 100%; height: 31px; background: url(/.s/t/799/16.gif); } #main-middle { width: 100%; background: url(/.s/t/799/17.gif); } #main-body { margin: 0px 20px; width: 520px; padding: 1px 0px; } #main-body a { color: #015e7d; } #main-bottom { width: 100%; height: 74px; background: url(/.s/t/799/18.gif); } .eTitle { font: 14px 'Tahoma', 'Arial'; color: #631700; text-transform: uppercase; } #main-body .eTitle a { font: 14px 'Tahoma', 'Arial'; color: #631700; } .eTitle a:hover {} .eMessage, .eText, .eAnswer { font: 11px 'Arial'; text-align: justify !important; color: #4d3326; } .cMessage { text-align: justify !important; } .eDetails, .eDetails1, .eDetails2 { background: #ceb07c; border: 1px solid #b2986b; padding: 2px 5px; margin-top: 5px; } .cBlock1, .cBlock2 { background: #ceb07c; color: #727272; background: url(/.s/t/799/19.png); } /*--------------------- Main content end ---------------------*/ /*--------------------- Containers start ---------------------*/ .block { width: 180px; } .blocktop { width: 180px; height: 10px; overflow: hidden; background: url(/.s/t/799/20.png); } .blockbottom { width: 180px; height: 9px; overflow: hidden; margin-bottom: 20px; background: url(/.s/t/799/21.png); } .blockmiddle { width: 180px; background: url(/.s/t/799/22.png); } .blocktitle { text-align: center; font: 14px 'Times New Roman'; color: #ffd403; text-transform: uppercase; } .blockcontent { text-align: left; margin: 0px 6px 0px 6px; margin-top: 5px; width: 168px; padding: 1px 0px; } #MCaddFrm { overflow: hidden; width: 168px; } .blockcontent ul { margin: 0; padding: 0; margin-left: 16px; } .blockcontent li { margin-left: 10px; } .blockcontent li a { color: #5d5d5d; } .blockcontent li a:hover { color: #e5891c; } .blockcontent a { color: #e5891c; } .blockcontent a:hover {} .calTable { font: 12px 'Arial'; } .calTable td { padding: 3px; } .calMdayIs, .calMdayIsA { background: #200c00; border: 1px solid #411a02; } a.calMdayLink { color: #ffffff; } .calWday { color: #ffffff; background: #200c00; border: 1px solid #411a02; } .calWdaySe, .calWdaySu { color: #200c00; background: #fcd211; border: 1px solid #d2770f; } .calMday, calMdayA, .calMdayIs {} .calMdayA { color: #e83f63; font-weight: bold; } a.calMonthLink { color: #ffffff; } a.groupAdmin { color: #e83f63; } .swchItem span, .swchItemA span { background: #ceb07c; border: 1px solid #b2986b; padding: 2px 5px; height: 20px; color: #755112; } a.swchItem { color: #755112 !important; } .swchItem span:active {} .swchItem {} .admBarCenter div, .myWinSuccess {} #pagesBlock1 { height: auto; padding: 3px 0px; } /*---------------- Mainmenu start------------*/ .uMenuH li {float:left;padding: 0 5px;list-style:none;} ul.uMenuRoot { margin: 0px; padding: 0px; list-style-type: none; } .uMenuV li a { margin-left: 0px; font: bold 11px 'Tahoma', 'Arial'; color: #5d5d5d; background: url(/.s/t/799/23.png) no-repeat; background-position: 0px -2px; display: block; width: 158px; margin-left: 4px; } .uMenuV li a:hover{ color: #fcd211; text-decoration: none; } .uMenuV .umenuRoot span { margin-left: 15px; } .uMenuV li { padding: 2px 0px; margin-top: 2px; margin-left: 0px; background: #200c00; } .uMenuV li:nth-child(odd) { background: #200c00; } .uMenuV li:nth-child(even) { background: #150800; } .blockcontent .uMenuRoot li {} .blockcontent .uMenuRoot a {} .blockcontent .uMenuRoot a:hover {} .blockcontent .uMenuRoot a:active {} .blockcontent .uMenuRoot a.uMenuItemA {} .uMenuItem {} .uMenuV .uMenuArrow { position: absolute; top: 0px; right: 0px; width: 5px; height: 17px; background: url(/.s/t/799/24.png); } /*------------------- Mainmenu end -------------------*/ /*------------------- SubMenu start ------------------*/ .sidebar .u-menu .xw-tl, .sidebar .u-menu .xw-bl { display: none; } .sidebar .u-menu .xw-ml, .sidebar .u-menu .xw-mr { background: none !important; padding: 0px !important; } .sidebar .u-menu .xw-mc { background: none !important; border: 0px !important; } .sidebar .u-menubody { background-position: 0px -2px; border: 0px !important; } .sidebar .u-menu .u-menuvitem { background: #200c00 !important; } .sidebar .u-menu .u-menuvitem:nth-child(2n) { background: #150800 !important; } .sidebar .u-menu .u-menuitemhl { color: #fcd211 !important; text-decoration: none; background: #200c00 !important; } .sidebar .u-menu .u-menuitemhl span { color: #fcd211 !important; } .sidebar .uMenuItem a { font: bold 11px 'Tahoma', 'Arial'; color: #5d5d5d !important; background-position: 0px -2px; } .sidebar .uMenuItem a:hover { color: #fcd211 !important; } .sidebar .u-menuarrow { top: -2px !important; } /*------------------- SubMenu end ------------------*/ /*--------------------- Containers end ---------------------*/ /*--------------------- Footer start ---------------------*/ #footer { position: relative; width: 1000px; height: 164px; background: url() no-repeat; margin: auto; margin-top: -10px; margin-bottom: 10px; padding-top: 1px; } #footer_block { width: 500px; height: 50px; margin: auto; margin-top: 104px; } #copyright { line-height: 50px; float: left; width: 200px; text-align: left; text-transform: uppercase; } #powered_by { float: right; line-height: 30px; margin-top: 10px; float: right; width: 300px; text-align: right; } #powered_by a { color: #e5891c; } #powered_by img { vertical-align: middle !important; } /*--------------------- Footer end ---------------------*/ /*--------------------- Forum start ---------------------*/ .forumContent { position: relative; z-index: 5; margin: 12px 0px 0px 35px; width: 930px; overflow: hidden; color: #4d3326; } .gDivLeft { background: url(/.s/t/799/26.jpg) no-repeat; padding-top: 30px; } .gDivBottomCenter { background: url(/.s/t/799/27.jpg) no-repeat; height: 61px; } .forumContent a { color: #015e7d; } .forumContent table td { color: #5d4031; } .gTable { border-collapse: collapse; background: none; width: 890px !important; } .postTable { border-collapse: collapse; background: none; } .gDivRight { background: url(/.s/t/799/28.jpg) repeat-y; padding: 0px 20px 0px 20px; } .gTable td { border: 1px solid #be886a; } .postTable td { border-collapse: collapse; } .gTable td.gTableTop, .gTableTop a { border: 0px; color: #631700; font: 14px 'Tahoma', 'Arial'; text-transform: uppercase; padding-left: 0px; } .gTableTop a {} .gTableTop a:hover {} .gTable td.gTableSubTop { background: #ceb07c; color: #4d3326; } .gTableTop, .gTableSubTop, .forumNameTd, .forumThreadTd, .forumPosrTd, .forumLastPostTd, .threadNametd, .threadPostTd, .threadAuthTd, .threadViewTd, .threadLastPostTd, td.threadsDetails, td.forumOnlineBar { padding: 3px 10px; } #frM6 td, #frM14 td, #frM50 td, #frM56 td, #frM59 td { padding: 3px 10px; } td.threadsDetails, td.forumOnlineBar { border: 0px; } .gTableSubTop a { color: #4d3326; } .postTable td { padding: 3px 10px; } .postBottom table td { border: 0px; } .postSeparator { display: none; } .posttdMessage { text-align: justify; } .threadPostTd, .threadViewTd, .threadAuthTd, .forumThreadTd, .forumPostTd { text-align: center !important; } a.TopSortLink {} a.TopSortLink:hover {} a.postUser { font-weight: bold; } a.forum, a.threadLink { font: 12px 'Arial'; color: #631700; } .quoteMessage {} .forumDescr, .threadDescr { font: 10px 'Arial'; color: #966b55; } td.pollQuestion, .pollResults td, td.pollResults, td.pollTotal, td.pollAnswer, td.pollButtons, .smiles td{ border: 0px; } td.pagesInfo, td.switch, td.switchActive { background: #ceb07c; border: 1px solid #5d4031; padding-left: 5px; padding-right: 5px; } td.switch a { color: #5d4031; } .switchActive { font-weight: bold; } /*--------------------- Forum end ---------------------*/ /*--------------------- INPUTS start ---------------------*/ input, select { font: 11px 'Tahoma', 'Arial'; padding: 3px 0px; } input[type=submit], input[type=reset], input[type=button] { color: #fcd211; font: 11px 'Tahoma', 'Arial'; background: #200c00; border: 1px solid #e0b73f; border-radius: 5px; -moz-border-radius: 5px; margin-top: 2px; padding-left: 15px; padding-right: 15px; cursor: pointer; } input[type=submit]:hover, input[type=reset]:hover, input[type=button]:hover { background: #3d1700; } input[type=submit]:active, input[type=reset]:active, input[type=button]:active { background: #592201; } #container input[type=text], #container input[type=password], #container textarea, .popup input[type=text], .popup input[type=password], .popup textarea { border: 1px solid #463e1b; background-image: url(/.s/t/799/29.gif); background-repeat: repeat-x; background-color: #1e0b00; color: #ffffff; margin-bottom: 2px; } textarea {} #mchatBtn, input.codeButtons, input.button { padding-left: 0px; padding-right: 0px; } .queryField { width: auto !important; } .niceRadio { width: 16px; height: 16px; display: inline-block; cursor: pointer; background: url(/.s/t/799/30.png); background-position: 0 -32px; overflow: hidden; vertical-align: middle; } .radioChecked { background-position: 0 0px !important; } .niceRadio input { margin-left: -17px; } span.niceRadio:hover { background-position: 0 -16px; } /*--------------------- INPUTS end ---------------------*/ /*--------------------- POPUP start ---------------------*/ .popup a {} .popup { width: 95%; margin: auto; } .popuptitle { color: #631700; font: 14px 'Tahoma', 'Arial'; text-transform: uppercase; } .popupbody a { margin-top: 5px; color: #631700; } .ptl { width: 35px; height: 31px; background: url(/.s/t/799/31.jpg); } .ptm { height: 31px; background: url(/.s/t/799/32.jpg); } .ptr { width: 35px; height: 31px; background: url(/.s/t/799/33.jpg); } .pml { width: 35px; background: url(/.s/t/799/34.jpg); } .pbody { background: url(/.s/t/799/35.jpg); } .pmr { width: 35px; background: url(/.s/t/799/36.jpg); } .pbl { width: 35px; height: 31px; background: url(/.s/t/799/37.jpg); } .pbm { height: 31px; background: url(/.s/t/799/38.jpg); } .pbr { width: 35px; height: 31px; background: url(/.s/t/799/39.jpg); } /*--------------------- POPUP end ---------------------*/
2012-01-26 Дата: Четверг, 26.01.2012, 18:00 | Сообщение # 10
Аццкий кодер
Группа: Администраторы
Статус: Unknown
Alex86 , Quote (Alex86 )
Доброго здравия дружище.
Доброго) Quote (Alex86 )
У меня стандартный дизайн 799 и слегка переделаный. Там всё на ксс. Как там сотворить такое чудо?
Какое чудо-то? Словами объясни. ...
2012-01-26 Дата: Четверг, 26.01.2012, 20:46 | Сообщение # 11
Сержант
Группа: Пользователи
Статус: Offline
Привет ещё раз. Да что обьяснять, я всё понял как это работает, но вот как его заставить работать не знаю. У меня и фон и шапка в ксс сделана. Код я выложил. Я пробавал и информером и скриптом с автомотической заменой фона, на другом сайте где фон и шапка в html работает, а тут не пойму куда что вставить. Тестовый сайт: http://leg-equilibrium.clan.suДобавлено (26.01.2012, 20:46) --------------------------------------------- Ну так как, можно что нибудь в моём случае сделать ?
Сообщение отредактировал Alex86 - Четверг, 26.01.2012, 18:35
2012-01-26 Дата: Четверг, 26.01.2012, 21:17 | Сообщение # 12
Аццкий кодер
Группа: Администраторы
Статус: Unknown
Alex86 , Quote (Alex86 )
Да что обьяснять, я всё понял как это работает, но вот как его заставить работать не знаю.
Ну объясните, хотя бы, что хотите заставить меняться ... Шапку что ли? Quote (Alex86 )
У меня и фон и шапка в ксс сделана. Код я выложил.
И что? Контекстные стили имеют более высокий приоритет. Так что, ничего страшного. Quote (Alex86 )
Ну так как, можно что нибудь в моём случае сделать ?
Можно практически все, и не думаю что ваш случай исключение, главное хотите ли вы этого. Если хотите - то пробуйте, а что будет не получаться спрашивайте. Тем более, если написанное выше понятно. ...
2012-01-27 Дата: Пятница, 27.01.2012, 06:52 | Сообщение # 13
Сержант
Группа: Пользователи
Статус: Offline
Доброе утро. Я хочу чтоб фон сайта менялся. Я уже пробовал сделать, но у меня не получилось. Не пойму куда вставлять скрипт. Вставлял в и в css и в html ничего не получилось. На другом сайте с другим шаблоном всё работает, а тут нет. Если не затруднит подскажи пожалуйста в какое место этот скрипт добавить, коды в посте выше. Спасибо.
2012-01-27 Дата: Пятница, 27.01.2012, 10:49 | Сообщение # 14
Аццкий кодер
Группа: Администраторы
Статус: Unknown
Alex86 , Quote (Alex86 )
Не пойму куда вставлять скрипт. Вставлял в и в css и в html ничего не получилось.
Скрипт вставляют в шаблон, если нужно чтобы фон менялся на всех страницах сайта, то в глобальный блок, например «Верхний». ... Quote (Alex86 )
в какое место этот скрипт добавить, коды в посте выше.
В глобальный блок «AHEADER » - в любое место, можно в конец блока. ...
2012-01-27 Дата: Пятница, 27.01.2012, 17:26 | Сообщение # 15
Сержант
Группа: Пользователи
Статус: Offline
Не получаеться. Шапка съезжает в низ. Мне кажеться это потому что все блоки в css настраиваються. При добавлении в html в любое место в любой блок, не работает и дизайн плывёт.