Студопедия
Случайная страница | ТОМ-1 | ТОМ-2 | ТОМ-3
АрхитектураБиологияГеографияДругоеИностранные языки
ИнформатикаИсторияКультураЛитератураМатематика
МедицинаМеханикаОбразованиеОхрана трудаПедагогика
ПолитикаПравоПрограммированиеПсихологияРелигия
СоциологияСпортСтроительствоФизикаФилософия
ФинансыХимияЭкологияЭкономикаЭлектроника

Счетчик

First-child и :last-child | Угадать карту с картинкой | Выражение | HEX notation | Position | Значения | First-of-type | Страница с Пиццой | Яваскрипт ХТМЛ | Запрос на ввод данных |


Читайте также:
  1. Технические характеристики счетчика Альфа А1800
  2. Технические характеристики счетчика электрической энергии СО-И4491М2.

<html>

<head>

<script type="text/javascript" src="script.js"></script>

<link rel="stylesheet" type="text/css" href="style.css">

</head>

<body>

<div class="box">

<label for="qty"><abbr title="Quantity">Qty</abbr></label>

<input id="qty" value="0" />

<button id="down" onclick="modify_qty(-1)">-1</button>

<button id="up" onclick="modify_qty(1)">+1</button>

</div>

</body>

</html>

 

 

function modify_qty(val) {

var qty = document.getElementById('qty').value;

var new_qty = parseInt(qty,10) + val;

 

if (new_qty < 0) {

new_qty = 0;

}

 

document.getElementById('qty').value = new_qty;

return new_qty;

}

 

 

body {

font-family: helvetica, arial, verdana, sans-serif;

background-color: #fff;

color: #333;

}

 

input {

font-size: 2.4em;

color: #000;

background-color: transparent;

text-align: center;

border-width: 0;

width: 100%;

margin: 0 0.1em 0;

color: #fff;

}

 

label {

display: block;

font-size:.8em;

}

 

button {

/* basics */

color: #444;

background-color: #B5B198;

/* rounded corners */

-webkit-border-radius: 6px;

border-radius: 6px;

-moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box;

font-weight: bold;

 

}

 

button:hover, button:active, button:focus {

background-color: #CBC7AE;

}

 

.box {

/* basics */

background-color: #444;

color: #C4BE92;

text-align: center;

 

/* rounded corners */

-webkit-border-radius: 12px;

border-radius: 12px;

-moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box;

padding:.8em.8em 1em;

width: 8em;

margin: 0 auto;

-webkit-box-shadow: 0px 0px 12px 0px #000;

box-shadow: 0px 0px 12px 0px #000;

 

}

_____________________________________________________________________________________


Дата добавления: 2015-08-17; просмотров: 32 | Нарушение авторских прав


<== предыдущая страница | следующая страница ==>
Цельсий и Фаренгейт| Динамическое создание эелементов

mybiblioteka.su - 2015-2024 год. (0.005 сек.)