Posts Tagged ‘ CSS ’
Бегущая строка на JavaScript своими руками
- 28 July
- Posted in JavaScript
- Tags: CSS, HTML, JavaScript
- 24 Comments
Сегодня речь пойдет о создании простого скрипта для имитации эффекта бегущей строки. Для начала, придумаем, как это будет работать. По идее должен быть внешний контейнер, который определит размеры блока бегущей строки и ее положение в пространстве на странице, назовем его marquee_container. Также должен существовать блок, содержащий “бегущий” текст, наречем его – marquee_text.
Теперь должно быть все просто, мы задаем родительскому блоку фиксированную ширину, position: relative (для того, чтобы мы могли абсолютно позиционировать блок с текстом относительно текущего), overflow: hidden (для того, чтобы “бегущий” текст скрывался за границами родительского блока). Далее пишем скрипт, который отодвигает текст вправо на ширину родительского блока (теперь он не видим) и потом перемещает его влево с заданной скоростью, пока текст не скроется полностью. И повторяем это действие снова и снова =).
Стилизированный раскрывающийся список (select в html)
- 10 September
- Posted in CSS, JavaScript
- Tags: CSS, HTML, JavaScript
- 5 Comments
Ниже представлено решение на JavaScript и CSS, с помощью которого можно было бы изменить внешний вид любой части выпадающего списка. При этом соблюдена кроссбраузерность, а также решена проблема, возникающая в IE 6 при перекрытии DIV`ом выпадающего списка select, который оказывался видимым при любом значении z-index.
Циклическая прокрутка содержимого в блоке div
- 5 August
- Posted in JavaScript
- Tags: CSS, HTML, JavaScript
- 2 Comments
Начнем с того, что снова возникла необходимость создать плавную автоматическую прокрутку текста в DIV`е и зациклить ее. Несложно догадаться, что для этого были выбраны следующие инструменты: CSS и JavaScript.
Графический checkbox с помошью JavaScript
- 23 June
- Posted in CSS, JavaScript
- Tags: CSS, HTML, JavaScript
- 3 Comments
Работая над последним проектом, возникла надобность изменить вид элементов формы: checkbox и select. Так как велосипед изобретать мне не свойственно, я решил почитать немного умных мыслей, посоветоваться с духами в он-лайне. Потратив пару часов своего времени, я нашел следущее решение.
Вертикальное меню
- 5 April
- Posted in CSS
- Tags: CSS, HTML, JavaScript
- No Comment
Существует множество способов создания вертикального меню. С помощью таблиц, блочной верстки, с JavaScript или без него … Ниже представлен наиболее простой способ создания вертикального меню, используя списки и CSS.
Калькулятор средствами JavaScript
- 29 March
- Posted in JavaScript
- Tags: CSS, HTML, JavaScript, PHP
- 3 Comments
Калькулятор предназначен, например, для расчета конечной стоимости продукта или услуги в соответствии с прайсом. Как правило, потребность в использовании on-line калькулятора возникает в том случае, когда коммерческий(ие) продукт(ы) обладают несколькими динамическими свойствами (цвет, тип материала …)
Горизонтальное меню
Меню сайта, которые мы видим на каждом сайте, могут быть оформлены как списки. По большому счету, меню сайта и является списком ссылок. Но для того чтобы список отображался не в том виде, в каком выводит браузер, следует воспользоваться каскадными таблицами стилей CSS. В данном случае, нам следует расположить элементы списка горизонтально и убрать маркеры.