Вернуться   Дизайнерский форум » ВЕБ-ПРОГРАММИРОВАНИЕ » HTML, CSS, JavaScript

Миникалькулятор с помощью JS

Обсуждение темы Миникалькулятор с помощью JS в разделе HTML, CSS, JavaScript, часть категории ВЕБ-ПРОГРАММИРОВАНИЕ; Можете подсказать, как сделать вот такой , небольшой калькулятор? Где просто введеное число в форму "а", умнажалось на "n-ое" число, и произведение выводилось ...


Закрытая тема
 
Опции темы
Старый 25.08.2009, 21:44   #1
Можете подсказать, как сделать вот такой, небольшой калькулятор? Где просто введеное число в форму "а", умнажалось на "n-ое" число, и произведение выводилось в форму "b".
Можно даже просто, развернутно намекнуть.

Последний раз редактировалось Dejust; 25.08.2009 в 21:49..
 
Старый 25.08.2009, 21:44
Ссылки
Старый 26.08.2009, 06:14   #2
Артем Колесников, там же в коде можно посмотреть
 
Старый 26.08.2009, 07:58   #3
Цитата:
Сообщение от Silver Посмотреть сообщение
там же в коде можно посмотреть
да я знаю, просто когда впервый раз откопал код, решил настроить и нече не работало, вот и создал топик. Сча все нормально)


З.Ы. Думал создать новую тему, но лучше отпишусь сюда.


Откопал тут фильтр для PNG в IE на JavaScript слудющего содержание.

Код HTML:
var arVersion = navigator.appVersion.split("MSIE")
var version = parseFloat(arVersion[1])

if ((version >= 5.5) && (document.body.filters)) 
{
   for(var i=0; i<document.images.length; i++)
   {
      var img = document.images[i]
      var imgName = img.src.toUpperCase()
      if (imgName.substring(imgName.length-3, imgName.length) == "PNG")
      {
         var imgID = (img.id) ? "id='" + img.id + "' " : ""
         var imgClass = (img.className) ? "class='" + img.className + "' " : ""
         var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' "
         var imgStyle = "display:inline-block;" + img.style.cssText 
         if (img.align == "left") imgStyle = "float:left;" + imgStyle
         if (img.align == "right") imgStyle = "float:right;" + imgStyle
         if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle
         var strNewHTML = "<span " + imgID + imgClass + imgTitle
         + " style=\"" + "width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";"
         + "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"
         + "(src=\'" + img.src + "\', sizingMethod='scale');\"></span>" 
         img.outerHTML = strNewHTML
         i = i-1
      }
   }
}
Вывел код в отдельный js файл и подключаю через условные комментарии к IE 6... Вот, естественно не че не пашет, а ИЕ требует некий объект (срабатывает ошибка).

Очень бы было интересно как правильно настроить сей фиьтр, а можно и какой нибудь другой.
 
Старый 31.08.2009, 02:17   #4
Цитата:
Очень бы было интересно как правильно настроить сей фиьтр, а можно и какой нибудь другой.
А почему нельзя использовать expression?
Код:
<script type="text/javascript">
	function fixPng (element) {
	    if (/MSIE (5\5.|6).+Win/.test(navigator.userAgent)) {
	        var src;
	        if (element.tagName == 'IMG') {
	            if (/\.png$/.test(element.src)) {
	                src = element.src;
	                element.src = './imgs/px.gif';
	            }
	        } else {
	            src = element.currentStyle.backgroundImage.match(/url\("(.+\.png)"\)/i);
	            if (src) {
	                src = src[1];
	                element.runtimeStyle.backgroundImage = 'none';
	            }
	        }
	        if (src) {
	            element.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + src + "', sizingMethod='crop')";
	        }
	    }
	}
</script>
./imgs/px.gif - путь до прозрачного gif'а с размерами 1x1 pixel.
Соответственно в css:
Код:
.fixPng {
    filter:expression(fixPng(this));
}
И класс .fixPng можно применять не только к изображениям, но и к div'ам с фоновым изображением .png. (Ибо sizingMethod='crop')
 
Этот пользователь сказал спасибо php5user за это полезное сообщение:
Dejust (31.08.2009)
Старый 31.08.2009, 08:26   #5
php5user, попробывал этим способом, но как то он сразу все изображение делает прозрачным...
 
Старый 31.08.2009, 10:08   #6
Цитата:
php5user, попробывал этим способом, но как то он сразу все изображение делает прозрачным...
Ну да. Он сначала делает его прозрачным (./imgs/px.gif), а потом загружает само изображение .png. Для IE другого решения просто не существует, если .png используется в <img />. Вообще сама собака зарыта здесь:
Код:
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='./imgs/image.png', sizingMethod='crop')
./imgs/image.png - путь до изображения.
P.S. Сам я редко использую .png в <img />. Такой скрипт увеличивает время загрузки страницы (пускай незначительно). Проще использовать свойство filter для конкретного div'а и все.
 
Старый 31.08.2009, 12:08   #7
Вообще я сейчас нашёл более красивое решение задачи. Дело в том, что этот pngfix не будет работать, если отключен javascript. Но можно сделать абсолютно полную кроссбраузерность:

Итак. Для этого мы не используем img вообще. вместо этого div с бэкграундом:
Код HTML:
<div id="someimage"></div>
в head-е всё делаем просто
Код HTML:
<link rel="stylesheet" href="css/style.css" type="text/css" />
<!--[if IE 6]>
<link rel="stylesheet" href="css/ie6.css" type="text/css" />
<![endif]-->
Ну а содержимое файлов такое:
style.css
Код:
...
#someimage { background:url(../images/mypng.png); }
...
ie6.css
Код:
...
#someimage 
{ 
    background:none;
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/mypng.png', sizingMethod='crop')
}
...
Ну вот так будет полнейшая кроссбраузерность, независимая от скриптов. Только не забываем, что alphaImageLoader гораздо менее гибок, нежели background.
 
Старый 31.08.2009, 13:24   #8
Цитата:
Вообще я сейчас нашёл более красивое решение задачи.
Я бы назвал это решение задачи тривиальным, так как уже после стали использовать expression. Цитирую сам себя:
Цитата:
P.S. Сам я редко использую .png в <img />. Такой скрипт увеличивает время загрузки страницы (пускай незначительно). Проще использовать свойство filter для конкретного div'а и все.
Цитата:
Дело в том, что этот pngfix не будет работать, если отключен javascript.
Честно говоря, сомневаюсь, что сейчас кто-либо вообще отключает JavaScript. А если и так, то давайте забудем про Ajax?
 
Старый 04.09.2009, 15:09   #9
Цитата:
Сообщение от php5user Посмотреть сообщение
Я бы назвал это решение задачи тривиальным, так как уже после стали использовать expression. Цитирую сам себя:


Честно говоря, сомневаюсь, что сейчас кто-либо вообще отключает JavaScript. А если и так, то давайте забудем про Ajax?
Вы, что, уважаемый? Просто одно из правил хорошего кода гласит: напичкай страницу js стольким, скольно нужно для реализации всех придуманных фишек, но если есть возможность, то сделай так, чтобы работало при отключенном js.

разве ложно сделать так:
<a href="/somepage" class="ajaxload" />
скриптом же меняем "/somepage" на "javascript:;" и прописываем нужный обработчик ссылке. Если есть javascript, то будет AJAX. Если нет, то будет просто ссылка. Для самых сложных случаев существует тэг <noscript>

Добавлено через 43 секунды

А во всевозможных организациях JavaScript отключают часто... (относительно часто).

Последний раз редактировалось Асмодиан; 04.09.2009 в 15:09.. Причина: Добавлено сообщение
 
Старый 04.09.2009, 22:20   #10
Не по теме о теме.

Достаточно много раз натыкаюсь на эту тему Миникалькулятор и постоянно не могу с первого раза правильно прочесть название темы, как заговоренная как-будто.

Читаю, то Миникулятор, то Миниаулятор, какие-то ассоциации у меня не здоровые.

Не было ни одного раза, чтобы я правильно прочел название данной темы, почему не знаю, что-то со зрением, наверное.
 
Старый 04.09.2009, 22:20
Закрытая тема




Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Имитирование таблицы с помощью <div> coffe_drinker HTML, CSS, JavaScript 5 25.04.2011 19:33
Как передвинуть меню с помощью CSS Nikolay-89 HTML, CSS, JavaScript 12 08.05.2010 09:38
ссылка во флеш с помощью xml Dims Технологии Flash 2 07.03.2008 01:03
Позиционирование <div> с помощью css KUZEN HTML, CSS, JavaScript 5 11.07.2006 13:41
С помощью чего??? ivan341 Растровая графика 9 16.11.2005 16:49


Текущее время: 00:00. Часовой пояс GMT +4.

Реклама на форуме Условия размещения рекламы
Биржа ссылок Заработай на сайте!
Дизайнерский форум