Текст обводки в - PullRequest
       82

Текст обводки в

0 голосов
/ 09 февраля 2012

Я хочу использовать текстовый штрих в <input type="text"/>, и мне нужно, чтобы он был кросс-браузерным (Firefox, Google Chrome, Safari, Opera, IE7 +).

Есть ли какой-нибудь способ сделать это (CSS 2.1, jQuery ...)?

Ответы [ 4 ]

4 голосов
/ 09 февраля 2012

Я полагаю, он говорит о текстовом штрихе свойства css (-webkit-text-stroke).Это только должным образом поддерживается в браузерах webkit, поэтому правильная реализация не может произойти, например, в Internet Explorer.Тем не менее, вы можете подделать его с text-shadow, который может работать в ie7 + .если вы ДОЛЖНЫ иметь его в ie.См. http://css -tricks.com / добавление штриха в веб-текст /

Это будет выглядеть примерно так:

.stroke_text {
    color: white;
    text-shadow:
          -1px -1px 0 #000,
          1px -1px 0 #000,
          -1px 1px 0 #000,
          1px 1px 0 #000;
}

или для встроенного:

<input type='text' 
       style="color: white; text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000; width:200px; font-size:20px;" />

Единственный реальный недостаток этого подхода заключается в том, что тень может составлять всего 1 пиксель или она начинает выглядеть смешно, поэтому она не является идеальной копией text-stroke.Тем не менее, вы можете захотеть взглянуть на условные CSS, где браузеры, которые поддерживают его, используют текстовый штрих, а другие используют этот хакерский подход.

0 голосов
/ 09 февраля 2012

Из-за неопределенного вопроса у вас есть много вариантов:

$('#myInput').change(function() { ... } ); // this will fire onblur if the text has changed
$('#myInput').keydown(function() { ... } ); // this will fire when a key is pressed down
$('#myInput').keyup(function() { ... } ); // this will fire when a key is released
$('#myInput').keypress(function() { ... } ); // this will fire when a printable key is pressed
0 голосов
/ 09 февраля 2012

Используя jQuery, вы можете сделать что-то вроде этого:

$(document).ready(function() {
    $("input[type='text']").keypress(function() {
        // Your logc goes here
    });
});

Это свяжет событие нажатия клавиши с каждым типом ввода = текст.Если вам нужен конкретный идентификатор, замените $ ("input [type = 'text'] на $ (" # your_id "). Кроме того, поиграйте с событиями keydown и keyup, чтобы выяснить, что подходит вам больше всего.

0 голосов
/ 09 февраля 2012

Я не совсем уверен, что вы имеете в виду, но я думаю, что это то, что вы хотите -

<input type="text" onkeyup="function_you_want_tocall()" />
...