Aleksty

Наверное главное, это то, что обозначено еще одно решение проблемы, которое не всем было известно, пост выше это подтверждает, а модификация, улучшение и прочее, это уже не так важно, кому интересно, тот найдет решение проблем, теперь "ему" известно, в каком направлении копать.

Посмотрите в этой теме, похоже это то что вам нужно.

Да нет проблем у скрипта, работает замечательно. Мне кажется все дело в совпадении имен атрибутов. Вот как пишем в форме: <strong><b class="uni">в</b>аше имя:</strong><br> <input class="fm1" name="name" type="text" value="" size="30" maxlength="32" required><br><br> <strong><b class="uni">в</b>аш email:</strong><br> <input class="fm1" name="email" type="text" value="" size="40" maxlength="52" pattern="^\s*\w+@\w+\.\w+\s*"><br><br> Все поля с атрибутом required и подвергаются проверки лисой. Так где атрибут pattern, все в порядке.

Решение проблемы с проверкой данных формы в FireFox4 Буквально вчера наткнулся на такую засаду: Имеется форма, валидация данных в которой происходит через яваскрипт. В данном случае сбой произошел при применении атрибута required. На скринах видно, что должно было быть, и есть(!), в версиях до 4-й, и что стало в 4-й - 1. Версия 3.3.16 - При ошибке, при заполнении формы, выскакивает сообщение и поля формы, в которых сделаны ошибки, заливаются фоном, вот так: 2. Версия 4 - Мало того, что вокруг полей появляется красная рамка, так и еще и невозможно ввести данные, тут же выдает сообщения, так примерно: Решение нашел, помогли добрые люди, цитирую: "Это проверка на стороне клиента с помощью HTML5". То есть у меня, похоже, проверка лисы "приговорила" мой скрипт! Мало того, в лисе использован именно этот атрибут - required, это скорее всего и стало причиной активации проверок формы лисой. Кстати, такая же история наблюдалась и в Google Chrome!!! Из спецификации: The simplest annotation is the required attribute, which can be specified on input elements to indicate that the form is not to be submitted until a value is given. By adding this attribute to the customer name and delivery time fields, we allow the user agent to notify the user when the user submits the form without filling in those fields: дальше код.... Менять свой скрипт не хотелось, очень удобный. Решение проблемы оказалось проще простого - можно отключить валидацию данных через атрибут novalidate у тега <form>! <form атрибуты="формы" novalidate></form> Может кто столкнулся с такой же проблемой! Решение перед вами.

Закругленные уголки в IE В какой-то момент возникла проблема с отображением закругленных уголков в IE, как и у многих наверное. Использовать картинки было нежелательно, так как широко использовался hover, который зацеплял, в 90%, как раз бордеры. Долго копался в сети, выбирая среди множества решений, пока не нарвался на одну статью, не помню уже где, но суть ее в следующем - реализация закругленных уголков в IE, осуществляется за счет подключения библиотеки HTC. Нужно просто разместить в корне сайта (у меня в папке htc) некий скрипт. Скрипт приводился в этом же примере. Кстати, в интернете можно найти решения и других проблем с IE на основе этой библиотеки! HTC: --Do not remove this if you are using-- Original Author: Remiz Rahnas Original Author URL: http://www.htmlremix.com Published date: 2008/09/24 Changes by Nick Fetchak: - IE8 standards mode compatibility - VML elements now positioned behind original box rather than inside of it - should be less prone to breakage Published date : 2009/11/18 <public:attach event="oncontentready" onevent="oncontentready('v08vnSVo78t4JfjH')" /> <script type="text/javascript"> // findPos() borrowed from http://www.quirksmode.org/js/findpos.html function findPos(obj) { var curleft = curtop = 0; if (obj.offsetParent) { do { curleft += obj.offsetLeft; curtop += obj.offsetTop; } while (obj = obj.offsetParent); } return({ 'x': curleft, 'y': curtop }); } function oncontentready(classID) { if (this.className.match(classID)) { return(false); } if (!document.namespaces.v) { document.namespaces.add("v", "urn:schemas-microsoft-com:vml"); } this.className = this.className.concat(' ', classID); var arcSize = Math.min(parseInt(this.currentStyle['-moz-border-radius'] || this.currentStyle['-webkit-border-radius'] || this.currentStyle['border-radius'] || this.currentStyle['-khtml-border-radius']) / Math.min(this.offsetWidth, this.offsetHeight), 1); var fillColor = this.currentStyle.backgroundColor; var fillSrc = this.currentStyle.backgroundImage.replace(/^url\("(.+)"\)$/, '$1'); var strokeColor = this.currentStyle.borderColor; var strokeWeight = parseInt(this.currentStyle.borderWidth); var stroked = 'true'; if (isNaN(strokeWeight)) { strokeWeight = 0; strokeColor = fillColor; stroked = 'false'; } this.style.background = 'transparent'; this.style.borderColor = 'transparent'; // Find which element provides position:relative for the target element (default to BODY) var el = this; var limit = 100, i = 0; while ((typeof(el) != 'unknown') && (el.currentStyle.position != 'relative') && (el.tagName != 'BODY')) { el = el.parentElement; i++; if (i >= limit) { return(false); } } var el_zindex = parseInt(el.currentStyle.zIndex); if (isNaN(el_zindex)) { el_zindex = 0; } //alert('got tag '+ el.tagName +' with pos '+ el.currentStyle.position); var rect_size = { 'width': this.offsetWidth - strokeWeight, 'height': this.offsetHeight - strokeWeight }; var el_pos = findPos(el); var this_pos = findPos(this); this_pos.y = this_pos.y + (0.5 * strokeWeight) - el_pos.y; this_pos.x = this_pos.x + (0.5 * strokeWeight) - el_pos.x; var rect = document.createElement('v:roundrect'); rect.arcsize = arcSize +'px'; rect.strokecolor = strokeColor; rect.strokeWeight = strokeWeight +'px'; rect.stroked = stroked; rect.style.display = 'block'; rect.style.position = 'absolute'; rect.style.top = this_pos.y +'px'; rect.style.left = this_pos.x +'px'; rect.style.width = rect_size.width +'px'; rect.style.height = rect_size.height +'px'; rect.style.antialias = true; rect.style.zIndex = el_zindex - 1; var fill = document.createElement('v:fill'); fill.color = fillColor; fill.src = fillSrc; fill.type = 'tile'; rect.appendChild(fill); el.appendChild(rect); var css = el.document.createStyleSheet(); css.addRule("v\\:roundrect", "behavior: url(#default#VML)"); css.addRule("v\\:fill", "behavior: url(#default#VML)"); isIE6 = /msie|MSIE 6/.test(navigator.userAgent); // IE6 doesn't support transparent borders, use padding to offset original element if (isIE6 && (strokeWeight > 0)) { this.style.borderStyle = 'none'; this.style.paddingTop = parseInt(this.currentStyle.paddingTop || 0) + strokeWeight; this.style.paddingBottom = parseInt(this.currentStyle.paddingBottom || 0) + strokeWeight; } if (typeof(window.rounded_elements) == 'undefined') { window.rounded_elements = new Array(); if (typeof(window.onresize) == 'function') { window.previous_onresize = window.onresize; } window.onresize = window_resize; } this.element.vml = rect; window.rounded_elements.push(this.element); } function window_resize() { if (typeof(window.rounded_elements) == 'undefined') { return(false); } for (var i in window.rounded_elements) { var el = window.rounded_elements[i]; var strokeWeight = parseInt(el.currentStyle.borderWidth); if (isNaN(strokeWeight)) { strokeWeight = 0; } var parent_pos = findPos(el.vml.parentNode); var pos = findPos(el); pos.y = pos.y + (0.5 * strokeWeight) - parent_pos.y; pos.x = pos.x + (0.5 * strokeWeight) - parent_pos.x; el.vml.style.top = pos.y +'px'; el.vml.style.left = pos.x +'px'; } if (typeof(window.previous_onresize) == 'function') { window.previous_onresize(); } } </script> HTML: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="ru"> <head> <title>Закругление уголков для IE (библиотека htc!)</title> <meta http-equiv="content-type" content="text/html;charset=utf-8" /> <style> .round { position: absolute; background: #f7f7f7; border: 2px solid #ddd; -moz-border-radius: 15px; -webkit-border-radius: 15px; -o-border-radius: 15px; -khtml-border-radius: 15px; border-radius: 15px; behavior: url("htc/border-radius.htc"); } </style> </head> <body> <div class="round" style="left: 100px; top: 100px; width: 300px; height: 300px;"></div> </body> </html> На скрине див в IE8: Тут можно скачать - index.html - htc/border-radius.htc Решает все проблемы и без всяких картинок! Ссылка (round_for_ie.rar 2.17 Kb) ЗЫ. Если взять половину стороны квадрата (тут у div-а 300/2 = 150px, то получим идеальный круг!

Карта изображений при помощи CSS На скрине показано, как это работает - 1. Загружено фоновое изображение. 2. При наведении на любой черно-белый сектор картинки применяем hover, это просто украшаловка. 3. При наведении на цветные участки имеем ссылку на нужный вам ресурс. В данном примере три условных поля: - на главную - новости - контакты Полей может быль сколь угодно много, не проблема. В архиве Map_CSS.rar (193 Кб), 4 файла - - index.html - style.css (tooltip + mapimage) - karta.png - karta_hover.png Стили меняются под ваши нужды без всяких проблем. Кроме html и css больше ничего не применяется, никаких скриптов. CSS: body { font-weight: bold; font-style: normal; font-size: 10px; vertical-align: top; outline: none; } a:link, a:visited, a:active { text-decoration: none; } /*--tooltyp for page--*/ a.tooltip span { position: relative; width: 130px; display: none; background: #ddd; border: 1px solid #818181; padding: 2px 2px; line-height: normal; text-align: center; color: #000; } a.tooltip:hover span { position: relative; display: block; KHTMLOpacity: 0.90; /* прозрачность*/ MozOpacity: 0.90; opacity: 0.90; -webkit-border-radius: 5px; /* скругленные углы */ -moz-border-radius: 5px; border-radius: 5px; z-index: 100; } /*--map navigation for page--*/ #mapcss { width:226px; height:339px; position: absolute; } #mapcss div.map1 a { display: block; width: 113px; /*размер активной области*/ height: 113px; /*размер активной области*/ left: 0px; /*координаты точки относительно картинки*/ top: 0px; /*координаты точки относительно картинки*/ position: absolute; } #mapcss div.map2 a { display: block; width: 113px; /*размер активной области*/ height: 113px; /*размер активной области*/ left: 113px; /*координаты точки относительно картинки*/ top: 113px; /*координаты точки относительно картинки*/ position: absolute; } #mapcss div.map3 a { display: block; width: 113px; /*размер активной области*/ height: 113px; /*размер активной области*/ left: 0px; /*координаты точки относительно картинки*/ top: 226px; /*координаты точки относительно картинки*/ position: absolute; } /*——-1——*/ #mapcss div.fon1 { display:block; background: url(karta.png) 0 0 no-repeat; width:226px; height:339px; position: relative; } #mapcss div.fon1:hover { background: url(karta_hover.png) 0 0 no-repeat; } /*——-2——*/ /*——-3——*/ /*——-n——*/ HTML: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Решение карты изображений на CSS</title> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <meta http-equiv="content-style-type" content="text/css"> <meta http-equiv="content-script-type" content="text/javascript"> <link href="style.css" rel="stylesheet" type="text/css" media="all"> </head> <body> <div id="mapcss" style="position: absolute; left: 400px; top: 100px;"> <div class="fon1"></div> <div class="map1"><a href="index_1.html" class="tooltip"><span style="left: -100px; top: 20px;">на главную</span></a></div> <div class="map2"><a href="index_2.html" class="tooltip"><span style="left: -100px; top: 20px;">новости</span></a></div> <div class="map3"><a href="index_3.html" class="tooltip"><span style="left: -100px; top: 20px;">контакты</span></a></div> </div> </body> </html> Координаты тултипа (тут - [span style=left:-100px;top:20px]), настраиваются индивидуально, хотя можно и в стилях. Вот вроде и все... Может кому и пригодится. Скачать

Правильно! Хотя ссылка была только для тебя, но все равно! Слушай что тебе говорят! Туда не ходи, ходи сюда, на адобу.ком там и бери! Да! Сначала в банк, за кредитом! Отдашь быстро, не горюй, в нашей стране все для людей, не забывай! Фотошоп: Обновление от 6 624.84 руб. Полная версия от 23 186.95 руб. Удачи!

Дружище! Пока, сам, ручками, не попробуешь эту, или какую иную прогу, мнения не важны! Качай ГИМП, установи, почитай мануал, попробуй, проделай тоже самое с Фотошопом, уже первое впечатление от интерфейса программы может стать решающим! Поверь! Совет уже дан, осталось попробовать. Гимп и фотошоп найдешь в сети, не проблема.

Понятно. Спасибо! Я уже начал конспект заполнять, основываясь на ответах ваших ребят По крайней мере прояснение в голове наступает.

Вы глубоко заблуждаетесь. Любые форматы открываются без проблем и PSD в том числе. Тем более что плагин псд идет в стандартном комплекте. НИКОГДА не возникало проблем ни с этим расширением ни с другими. Даже не знаю что еще и сказать, по крайней мере в моей практике, пока не возникало задач, которые нельзя было бы решить при помощи ГИМПа. Хотя, как говорят - на вкус и цвет.... ЗЫ. Глаза, кстати в ГИМПе править неудобно

Из своего опыта.... Чтобы не тратить время на изучения фотошопа, так как программа серьезная, после долгих поисков адекватной замены (мне нужно было работать с файлами DDS), наткнулся на GIMP С тех пор фотошоп мне просто по барабану, ГИМП все умеет, бесплатный и проще в освоении в разы. ЗЫ. При желании можно подключать плагины Фотошопа! Только установить его придется

Нда.... Все гениальное просто. Спасибо за пространный ответ. Нигде, кроме этого форума, не находил такого простого и доступного объяснения. В основном это беседы инопланетян на своем языке Еще раз спасибо!!!!

Как вариант пойдет. Но можно и иначе.... - Скачать литературу по HTML и CSS (для начала). - Забыть про "свободное время", теперь оно ассоциируется с ежедневным, многочасовым сидением за компом. - Изучать, пробовать, изучать, пробовать и так довольно долго.... - Забить в избранное этот форум и сайт htmlbook! - И гдавное! как тут уже писалось, решить для себя один простенький вопрос - "А надо мне этот весь гиморой?" Если ответ - НАДО! - то можно приступать

Кстати! Возник вопрос при возне с этим скриптом, да и не только с ним! Подскажите, есть-ли в яваскрипт возможность явного объявления глобальной переменной? Например в LUA это - setglobal(переменная); и все, дальше она видна отовсюду, вызываешь getglodal(); Все что нарыл по этой теме, так это обращение к функции в которой объявлена переменная! А если нет функции? В примере, что выше, именно так и происходит! В контейнере яваскрипт объявлена переменная "а", но уже из функции, которая в том же контейнере ее нельзя вызвать, она не видна. Или я что-то не догоняю, или есть какая-то возможность избежать дублирования? Подскажите!!!! Все время натыкаюсь на эту замороку.

СПАСИБИЩЕ!!!!!!!!!!! Век живи, век учись... Дальше неправильно ЗЫ. ВСЕ СРАБОТАЛО!!! Только пришлось сюда добавить кое чего - window.onload = function(){ var a = new Date().getHours();

А прикрутить разные комментарии к разным временным отрезкам нужно при помощи if? Тут мне малость непонятно (даже многость непонятно )! Тогда нужно весь скрипт изменений стилей включить в какую-то функцию? И в боди прописать вызов ее? Что-то типа этого: 1. onLoad - функция мзменения стилей 2. if(a>23){ вызов функции комментария} 3. ???????? тут не пойму! Или на кждый комментарий своя функция? или так - if(getHours() > 23){комментарий 1}?

Опа.... Спасибо! Я его в хедере прописывал, прямо в этом скрипте! Ща попробую

Здравствуйте. Немного предыстории. Главная страница оформлена с использованием фрагментов картин известных художников. Есть шесть файлов стилей, которые меняются в зависимости от времени. Вопрос в следующем: Как добавить в нужное место текстовый комментарий? Это просто упоминание о художнике, работы которого использованы при оформлении. Скрипт - <script type="text/javascript"> date = new Date(); a = date.getHours(); if (a > 23){ document.write("<link rel='stylesheet' href='style1.css' type='text/css' media='screen'>"); }else if (a > 20){ document.write("<link rel='stylesheet' href='style2.css' type='text/css' media='screen'>"); }else if (a > 17){ document.write("<link rel='stylesheet' href='style3.css' type='text/css' media='screen'>"); }else if (a > 14){ document.write("<link rel='stylesheet' href='style4.css' type='text/css' media='screen'>"); }else if (a > 11){ document.write("<link rel='stylesheet' href='style5.css' type='text/css' media='screen'>"); }else if (a > 7){ document.write("<link rel='stylesheet' href='style6.css' type='text/css' media='screen'>"); }else{ document.write("<link rel='stylesheet' href='style1.css' type='text/css' media='screen'>"); } </script> </head> <body> <noscript> <link href="style1.css" rel="stylesheet" type="text/css" /> </noscript> Сюда нужно вставить комментарии, после тега спан (у спана есть атрибут float:left) - <div id="copy"><span>&&&&&&&&&&&&&&&&&&&</span></div> PS. Пробовал так, не получается: box = document.getElementById('copy'); boxn = document.createElement('span'); boxn.id = 'comment'; boxn.innerHTML = '—————-ТЕКСТ————--'; box.appendChild(boxn);

Да не за что. Сам учусь, первоклашка....

Моветон, он конечно моветон, но только в кругу спецов! Пользователю по барабану, что там написано, ифраме или супер-пупер что-то еще. Если все красиво, удобно, крутится и вертится, значит все ок.

Может так нужно? <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <style type="text/css"> .wrap { height: 100px; width: 200px; background: red; position: relative;} .a { background: #000; color: #fff; position: absolute; bottom: 0; height:20px;} .b { background: #000; color: #fff; position: absolute; bottom: 20px; height:20px;} </style> </head> <body> <div class="wrap"> <div class="a">sdfsdfddfa ads fd </div> <div class="b">sdfs tttaaggggggggqqqtttttttttt </div> </div> </body> </html>

Если информация статична, то есть не меняется, то проще второй див скрыть (display:none), заранее прописав в нем ту же инфу, что и на основной странице. потом по onClick присвоить ему display:block и вывести в нужное место. Или пробовать через тег iframe.

Смешно.... А что еще заметило своим острым взглядом, Лох-Несское э-э-э.... чудище? Ой, простите, чудовище конечно!

Пиши во всех, хуже не будет Кстати, у меня такая верификация на яндексе не работала, почему-то... Так загляни внутрь файла! Не могут же они все все быть одинаковые?

Обычно это файл index.html, в смысле главная страница. Открой его, дальше все просто, типа этого Примерно так: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Щелковский районный культурный комплекс</title> —--ТУТ ТЕГИ МЕТА————- </head>