Pull to refresh
  • by relevance
  • by date
  • by rating

USB panic button

Gadgets

Известная компания Brando продолжает нас радовать компьютерными мелочами.
На этот раз — это USB Stress Panic Button.
Цена удовольствию — 17$.
После нажатия на кнопку на экране симулируется эффект взрыва бомбы, но я думаю можно установить всё что вам захочется.
Total votes 18: ↑10 and ↓8 +2
Views 885
Comments 3

Растягивание кнопок в IE

CSS *
Как-то всегда обходил эту проблему стороной, а теперь надоело. Суть в том что при большом размере кнопки IE растягивает свой «батон» превращая его в какое-то страшнейшее убожество:



Особенно обратите внимание на прелестные артефакты прозрачности по углам.

Какие есть выходы из этой ситуации?
Дальше поподробнее
Total votes 37: ↑32 and ↓5 +27
Views 1.5K
Comments 43

Кнопка «отправить». Просто и полезно.

Interfaces *
Достаточно просто улучшить юзабельность формы простым, но крайне эффективным способом — деактивация кнопки «отправить» после её нажатия.

Дабы не быть голословным, приведу пример для jQuery:

$('#id_кнопки').click(function()
 {
  $('this').attr('disabled', 'disabled')
 }
);


В идеале, кнопка должна становиться активной только после того, как форма будет полностью валидна.

Как подсказал Хабрапользователь nooze, стоит учитывать, что в случае AJAX реакции на отправку, следует учесть ошибки (например, не совпадающие логин и пароль, или таймаут запроса)

P.S> Возможно, тема уже поднималась, но упоминания на хабре не нашёл.
P.P.S> Спасибо за то что насрали в карму, вы хорошие люди :)
P.P.P.S> Я не принимаю модели хабра, в которой автор выкладывает всё и вся в топ, в таком случае просто нечего обсуждать.
Total votes 104: ↑71 and ↓33 +38
Views 3.6K
Comments 48

Делаем красивые кнопочки

CSS *
Зачастую стандартный вид кнопочек не может сочетаться с концепцией дизайна, которую придумал дизайнер, поэтому он рисует свои кнопочки.

Что обычно делает верстальщик при виде такой кнопки? Правильно, просто напросто, вырезает ее как есть, и вставляет ее в верстку как картинку.

Например:
<a href="some_page.html"><img src="button.gif" alt="Button"></a>
<input type="image" src="button.gif" alt="Button">


* This source code was highlighted with Source Code Highlighter.


Вроде бы все просто, но тогда верстальщику придется под каждую форму или ссылку вырезать новую картинку, тем самым плодя кучу картинок и тратя драгоценное время.
Читать дальше →
Total votes 95: ↑72 and ↓23 +49
Views 10K
Comments 53

Исследование на тему замены стандартных кнопок

JavaScript *
В процессе работы над интерфейсом одного продукта, появилась надобность в изготовлении собственного дизайна кнопок. За это время код, который заменяет стандартную кнопку на требуемую несколько раз переписывался и в данный момент тоже далёк от идеала. Учитывая все текущие проблемы кросс-браузерности, за это время выяснились и получилось нижеописанное.

Допустим, что она должна выглядеть примерно так:


Читать дальше →
Total votes 81: ↑60 and ↓21 +39
Views 2.6K
Comments 113

Кнопка на основе тега A без внутреннего SPAN

Lumber room
Весь интернет заполнен статьями как сделать расширяемую по длине кнопку
на основе CSS спрайтов.

Но все они используют дополнительный <span/> внутри тега <a>.
Это некрасиво и семантически неправильно.
Нужно сделать кнопку не используя JavaScript и доп. элементы.

Это возможно
Total votes 14: ↑6 and ↓8 -2
Views 976
Comments 26

Волшебный скролл полускрытых кнопок, который может убить и ваш вечер

Opera
Есть стандартная разметка скроллера, во внутреннем блоке кнопки. При клике на полускрытую кнопку внутренний блок скроллится так, что кнопка становится в середине внешнего блока.

Опера 10.63 win7

Код
<div style="float:left;height:32px;margin-right:5px;overflow:hidden;position:relative;width:330px;">
	<div class="scroll-wrapper" style="left: 0px;position:relative;width:5000px;">
<button>Button 1</button>
<button>Button 2</button>
<button>Button 3</button>
<button>Button 4</button>
<button>Button 5</button>
<button>Button 6</button>
<button>Button 7</button>
<button>Button 8</button>
<button>Button 9</button>
<button>Button 10</button>
<button>Button 11</button>
	</div>
</div>


Линк https://dl.dropbox.com/u/2899751/opera-scroll-bug.html
Для явления волшебного скролла нажать «Button 5». Cкролл на столько волшебный, что скроллит с отключенным javascript.
Total votes 46: ↑25 and ↓21 +4
Views 939
Comments 26

Простой щелчок кнопки

Development for Android *
Совсем недавно я написал пост, в котором выражал свое желание перейти от разработки для Windows Phone 7 к программированию под Android. К сожалению, некие внешние обстоятельства затормозили этот процесс и изучение идет не такими быстрыми темпами как хотелось бы. Но тем не менее желания не убавилось и скоро смогу уделить больше времени для Android.
А сегодня хочу рассказать о такой заурядной вещи, как обработка щелчка кнопки. Статья предназначена для новичков и будет говорить об очевидных вещах, но мне она стоила одной ночи.
Читать дальше →
Total votes 57: ↑43 and ↓14 +29
Views 80K
Comments 55

Подборка 10 css3 кнопок

CSS *
С каждым днем новые стандарты css3 и html5 всё более глубоко входят в жизнь верстальщиков и web-разработчиков, а браузеры с каждым днем становятся все более совместимыми с этими стандартами.



В связи с этим событием хотелось бы представить Вам подборку 10 css3 кнопок, которые смогут облегчить вам жизнь при верстке и создании web приложений.
Читать дальше →
Total votes 266: ↑227 and ↓39 +188
Views 90K
Comments 79

Рисуем свою кнопку в QGraphicsScene в PyQt4

Python *Qt *
Sandbox
Казалось бы, что может быть проще обычной кнопки с её стандартным поведением и привычным всему миру видом? Однако, сам процесс создания своей кнопки не менее интересен, чем создание целого приложения с помощью PyQt4.

Здесь приводится пример создания в QGraphicsScene своей рисованной кнопки с помощью QGraphicsWidget.

Рекомендуется к прочтению людям, имеющим опыт работы с PyQt4.
Читать дальше →
Total votes 20: ↑15 and ↓5 +10
Views 10K
Comments 22

Тайны кнопок в Android. Часть 1: Основы верстки

Programming *Development for Android *
Sandbox
Tutorial
Приветствую, уважаемое сообщество.

В своем цикле статей по разработке Android-приложений я хочу поделиться с вами интересными и полезными приемами верстки сложных элементов управления. Мы рассмотрим как базовые приемы верстки, так и продвинутые способы ее оптимизации, которые существенно облегчают развитие и сопровождение Android-приложений, экономят время и деньги.

Первая часть предназначена для начинающих разработчиков. Я покажу, как сделать достаточно сложную кнопку исключительно версткой, не применяя Java-кода, ни тем более собственных компонентов. Знание этих приемов верстки пригодится и при работе с другими компонентами Android. По ходу статьи я буду подробно пояснять, что означают те или иные константы, атрибуты, команды и тому подобное. Но я также буду давать ссылки на официальную документацию Google, где вы можете подробно изучить каждую тему. Данная статья обзорная, я не ставлю цели привести здесь всю документацию, переведенную на русский язык. Поэтому я рекомендую изучать официальные источники, в частности те статьи, ссылки на которые я привожу здесь.

Читать дальше →
Total votes 63: ↑49 and ↓14 +35
Views 213K
Comments 23

Кнопка «Load More» с использованием Ajax и jQuery и пагинация страниц в Ruby on Rails

Ajax *jQuery *Ruby on Rails *CoffeeScript *
Sandbox
Сам я только новичок в изучении RoR, но при разработке собственного проекта возникло желание вместо классической пагинации с помощью гема will_paginate сделать ее более удобной при помощи javascript. Это должна быть классическая кнопка, при нажатии на которую загружаются следующие n-записей. Решение проблемы на русском языке я не нашел, на английском есть, но я нашел только громоздкие и неудобные варианты. Как говорится, хочешь сделать что-то хорошо — сделай это сам. Вот что получилось.

Разбиение на страницы будем производить с помощью все того же гема will_paginate, также мы будем его использовать если javascript у пользователя отключен.

Итак сначала устанавливаем гем:

gem 'will_paginate'


bundle install

Читать дальше →
Total votes 6: ↑2 and ↓4 -2
Views 8.7K
Comments 4

Летающие панельки от нас улетели… О навигации и кнопке «Назад» в C#/XAML приложениях Windows 10

Development for Windows Phone *C# *Development for Windows *

Если вы захотите вынести настройки своего приложения UWP в «летающую панельку» Flyout, то я вас огорчу. Летающие панельки точно так же как и «волшебные Charm панельки» ушли в прошлое и теперь вместо них необходимо использовать другой способ отображения информации – навигацию. Про то, что и как читайте дальше
Читать дальше →
Total votes 20: ↑17 and ↓3 +14
Views 19K
Comments 7

UX-дизайн: флажки и переключатели в формах

Web design *Working with icons *Interfaces *Usability *
Translation
image

При создании форм дизайнеры часто стоят перед необходимостью выбора, какой элемент пользовательского интерфейса обеспечит необходимый уровень взаимодействия при изменении параметров. Безусловно, у каждого специалиста есть свои собственные правила, но всем следует помнить о некоторых неизменных аксиомах, которые действуют всегда и везде.

Выбор параметров может осуществляться с помощью флажков, переключателей, радиокнопок и раскрывающихся кнопок. Все варианты хороши, если правильно их использовать. В данной статье речь пойдет о флажках и переключателях.
Читать дальше →
Total votes 15: ↑12 and ↓3 +9
Views 23K
Comments 14

Arduino для начинающих. Часть 2

C++ *Robotics development *
Tutorial

Предисловие автора


Доброго времени суток, Хабр. Как и планировала, продолжаю цикл статей, которые помогут Вам в знакомстве с Arduino. Также, в каждой последующей статье (включая эту) вы сможете найти ответы на самые важные вопросы, которые появляются в комментариях. Для тех кто не читал первую часть, сюда.


Как определить полярность светодиода


На данный момент большинство светодиодов делают так, чтоб упростить процесс определения полярности. У светодиода есть две ножки, одна из которых будет длиннее другой. Длинная ножка – это плюс (анод). Короткая ножка — это минус (катод). Но что же делать если выводы светодиода одинакового размера? Иногда вывод катода отмечают точкой или небольшим срезом на корпусе. Также узнать полярность можно путём внимательного рассмотрения кристалла. Плюс имеет гораздо меньший размер внутри линзы по сравнению с минусом. Контакт минуса, в свою очередь, напоминает флажок, на котором размещается кристалл. Также можно определить полярность источником питания. Для этого необходимо источник тока (с напряжением от 3 до 6 вольт), резистор (с сопротивлением 220 – 470 Ом) и сам светодиод. Сначала соедините одну ножку светодиода с резистором. Затем коснитесь светодиодом контактов источника питания. Дотрагиваясь анодом к плюсу, а катодом к минусу, светодиод будет светиться (если он исправен).

Читать дальше →
Total votes 8: ↑8 and ↓0 +8
Views 14K
Comments 12

Секс в автомобиле или ещё одна кнопка старт-стоп с ардуино и светодиодами

DIY
Recovery mode
Однажды, занимаясь вышеуказанным действием в вышеуказанном месте кто-то из участвующих пнула ногой брелок на ключе. Брелоку тогда сильно досталось, но он тоже хорошо стоял и выдержал удар. В этот самый момент, не отвлекаясь от происходящего, меня второй раз посетила мысль, что болтающийся брелок — это чуть-чуть лишний элемент интерьера авто.

ножки
больше фоток
Total votes 72: ↑47 and ↓25 +22
Views 79K
Comments 91

Как с нуля написать приложение? С чего начать новичку? Flutter / Программирование

Programming *Development of mobile applications *Flutter *
Sandbox
Пол года назад я сама искала такую статью и теперь я очень хочу посоветовать себе в прошлом с чего можно начать.

1. Выбрать тему приложения


Не нужно долгих мук выбора, просто начните делать то, что вам пригодилось бы. Лучше что-то простое. Нужно понимать, что мы пока не стремимся быть Биллом Гейтсом. Это наше первое приложение, наш первый шаг.

Я уже как лет 7-8 болею спортом, потому идеей моего первого приложения было — база тренировок для поддержания себя в тонусе, с упражнениями для спины, рук, попы, ну и в целом, чтобы не скучно было.

2. На каком языке писать?


Я перепробовала несколько разных языков и разных SDK, мой выбор пал на Flutter и, собственно, язык на котором он обслуживается — dart, потому что:

  • Dart — легкий в изучении язык. Вам не составит труда ознакомиться с ним, в интернете полно информации и уроков. Скорость выполнения операций на нем сравнима с Objective-C, Swift, Kotlin, Java, а с последним у них очень много общего.
  • Flutter может компилировать и под Android, и под iOS. (Еще может в Fuchsia, но нам оно пока вряд ли нужно).
  • Удобство в работе с виджетами, гибкость и простота в использовании.

Виджеты бывают двух типов: StatefulWidget и StatelessWidget.

Грубо говоря, те, которым можно задать состояние и те, кому нет.
Читать дальше →
Total votes 48: ↑32 and ↓16 +16
Views 17K
Comments 24

Кнопки нестандартной формы в Unity UI

Unity3D *
Sandbox
Недавно у меня возникла необходимость использовать в своем проекте кнопки нестандартной формы. Однако эта на первый взгляд тривиальная задача вызвала у меня некоторые затруднения.

Проблема заключается в том, что стандартная кнопка UI обрабатывает нажатия даже по прозрачным областям, что в данном случае совсем не желательно. При этом у самого компонента Button нет никаких (видимых в инспекторе) параметров, которые могли бы отвечать за то, какие области кнопки могли бы обрабатывать наведение/нажатие.


Спустя некоторое время поисков в интернете и курения документации ко мне пришло следующее, при этом довольно простое, решение:
Читать дальше →
Total votes 14: ↑13 and ↓1 +12
Views 9.5K
Comments 8
1