Zebra: Итак. Ибо факи уже писались в небывалых количествах, однако то ли в них не до конца разбираютсЯ, то ли элементарно лень их перекопать , решила сделать вам скрипт помощник.
Смысл его работы таков. Если вы прочитали хотя бы первых два сообщения в этой теме FAQ по дизайну форума в CSS и хотя бы раз писали css коды, вы знаете, чоу каждого элемента есть свое название, которое мы прописываем, чтобы перекрасить, отредактировать и разукрасить какой-то элемент. Однако так как дизайнерские запросы у вас все растут, бывает так, что найти название именно того, чтоо вас интересует, вы никак не можете.
Ставим сие в HTML-низ
<script type="text/javascript"> function cookCopy() {document.cookie="helper=not"} window.onunload=cookCopy function helpCss() {document.cookie="helper=letcopy" var alls=document.getElementsByTagName("body")[0].getElementsByTagName("*") var e=0 for (e=0; e<=(alls.length-1); e++) { var styl=new Array() var styl2=new Array(0) var k=0 styl[0]=alls[e] styl2.splice(0, 0, makingCss(styl[0])) k=1 while(k<=10) {styl[k]=styl[k-1].parentNode if (styl[k].nodeName=="BODY") {break} styl2.splice(0, 0, makingCss(styl[k])) k=k+1} alls[e].title=styl2.join(" ") }} function makingCss(to) {if (to.id) {if ((to.id.indexOf("forum")!=-1)||(to.id.indexOf("category")!=-1)) {if (to.className.indexOf(" ")!=-1) {var ret="."+to.className.substr(to.className.lastIndexOf(" ")+1)} else {var ret="."+to.className}} else {var ret="#"+to.id}} else if ((!to.id)&&(to.className)) {if (to.className.indexOf(" ")!=-1) {var ret="."+to.className.substr(to.className.lastIndexOf(" ")+1)} else {var ret="."+to.className}} else if ((!to.id)&&(!to.className)) {var ret=to.nodeName.toLowerCase()} return ret} </script> <input id="csshelper" type="button" value="Помощь в css" onclick="helpCss()" />
Внизу страницы вы уывидите кнопочку Помощь в css. Когда васприспичит похимичить с дизайном нажимаете ее. Далее наводите мышкой на любой элемент на странице. И вуаля. Видит полный код этого элемента, в какую точку бы вы не тыкали. Далее с дизайном может совладать даже абсолютный двоечник.
Переписываете выданное вам имя элемента.
Например, вам могут показать такое.
#pun #pun-index #pun-title table tbody tr .title-logo-tdl
Это абсолютный путь к Логотипу.
Это название сверх-точное, поэтому чтобы не было прописано в вашем изначальном стиле, когда вы напишете свой код с этим названием, новый дизайн элемента перекроет старый и появится абсолютно точно.
Но чаще всего такого подробного пути к элементу прописывать НЕ НАДО. Сокращайте то что вы видите по-максимуму. Но УБИРАЙТЕ ТОЛЬКО С НАЧАЛА. Последних одного-двух слов в названии элемента почти всегда достаточно.
Напрример, от нашего случая достаточно будет оставить
.title-logo-tdl
Если вы оставили одно слово, но изменений не случилось, значит название надо написать чуть подробней. Добавьте второе слово.
Например, так
tr .title-logo-tdl
В общем удлиняйте, сокращайте, экспериментируйте.
Например в нашем случае мы так сделаем лого
.title-logo-tdl {background-image: url(...);}
Экспериментируйте, сильнее помочь нельзя.
З.Ы. Помните, что после того кк вынажали кнопку Помщь, подсказки вы увидите только на текущей странице. Если перейдете на другую страницу, жмите кнопку снова.
З.З.Ы. В принципе скрипт можно убираь и ставить п мере необходимости. Но его вполлне можно сотавить там навсегда. Ибо он очень маленький и страницу не грузит совсем, ибо работает только при нажатии на кнопку.
Чтобы кнопку видели только вы пишем в нагрузку
<script type="text/javascript"> if (document.getElementById('pun-status').innerHTML.indexOf("Ваш ник")==-1) {document.getElementById('csshelper').style.display="none" } </script>
Добавлено: копирование в буфер эта часть полноценно работает только для иксплорера. В смысле происходит автоматическое копирование в буфер обмена. Для других не придумано аналогичных функций. Но, при двойном клике на элемент его код появится в форме рядом с кнопкой помощи, страница сфокусируется на кформе и код будет уже выделен. Останется только копировать.
Добавляем под наш скрипт
<script type="text/javascript"> function copyPaste(event) {if (document.cookie.indexOf("letcopy")!=-1) { if (navigator.appName=="Netscape") {document.getElementById('copier').value=event.target.title document.getElementById('copier').select()} else {document.getElementById('copier').value=event.srcElement.title document.getElementById('copier').select() CopiedTxt = document.selection.createRange() CopiedTxt.execCommand("Copy")} }} </script> <BODY ondblclick='copyPaste(event)' > <textarea rows="4" cols="50" id="copier" ></textarea>
Чтобы скопировать - даблкликните на элемент, после того, как увидите его код.
Теги: помощь, дизайн, скрипт, возможности