Как сделать такие подсказки?

X

279

Xubart

26 апреля 2019, 07:13

1012

На этом сайте вверху строка поиска.

В ней постоянно меняющаяся подсказка, имитирующая набор названия товара, которая как бы намекает "набери текст тут" :)

Как такое сделать?

В их коде не разобрался :(

Удобный съем позиций (http://allpositions.ru/redirect/58277)

139

katenuha

26 апреля 2019, 07:52

#1

Xubart:
На этом сайте вверху строка поиска.
В ней постоянно меняющаяся подсказка, имитирующая набор названия товара, которая как бы намекает "набери текст тут" :)

Как такое сделать?
В их коде не разобрался :(

Скрипт

<script type="text/javascript">
(function (_, $) {
$.ceEvent('on', 'ce.commoninit', function(context) {
var input = $('#search_input',context);
if (input.length) {
var theaterForSearchBox = new TheaterJS();
theaterForSearchBox
.describe("SearchBox", .8, "#search_input")
.write("SearchBox:Стол письменный Милан-1 с надставкой").write({
name: 'wait',
args: [2000]
})
.write("SearchBox:Прихожая Тунис-1").write({
name: 'wait',
args: [2000]
})
.write("SearchBox:Компьютерный стол Имидж-53").write({
name: 'wait',
args: [2000]
})
.write("SearchBox:Шкаф обувной Люкс").write({
name: 'wait',
args: [2000]
})
.write("SearchBox:Полка настенная Грейс-3").write({
name: 'wait',
args: [2000]
})
.write(function () {
theaterForSearchBox.play(true);
});
input.removeClass('cm-hint').val('').attr('name', 'q');
}
});
})(Tygh, Tygh.$);
</script>

В строке var input = $('#search_input',context); вместо search_input укажите ваш id, который навешен на input (строку поиска)

Адаптирую Ваш сайт под мобильные устройства. (/ru/forum/946260) за 1 день.

X

279

Xubart

26 апреля 2019, 08:03

#2

Вот весь HTML код


<html>
<title></title>
<body>


<script type="text/javascript">
(function (_, $) {
$.ceEvent('on', 'ce.commoninit', function(context) {
var input = $('#search_input',context);
if (input.length) {
var theaterForSearchBox = new TheaterJS();
theaterForSearchBox
.describe("SearchBox", .8, "#search_input")
.write("SearchBox:Стол письменный Милан-1 с надставкой").write({
name: 'wait',
args: ***91;2000***93;
})
.write("SearchBox:Прихожая Тунис-1").write({
name: 'wait',
args: ***91;2000***93;
})
.write("SearchBox:Компьютерный стол Имидж-53").write({
name: 'wait',
args: ***91;2000***93;
})
.write("SearchBox:Шкаф обувной Люкс").write({
name: 'wait',
args: ***91;2000***93;
})
.write("SearchBox:Полка настенная Грейс-3").write({
name: 'wait',
args: ***91;2000***93;
})
.write(function () {
theaterForSearchBox.play(true);
});
input.removeClass('cm-hint').val('').attr('name', 'q');
}
});
})(Tygh, Tygh.$);
</script>  

<form>
<input type="text" name="123" value="" id="search_input" title="Поиск">
</form>



</body></html>

Не работает :(

Может какие то библиотеки JS нужны?

S

469

Sitealert

26 апреля 2019, 09:00

#3

Xubart:
Может какие то библиотеки JS нужны?

Скрипт TheaterJS.

Отпилю лишнее, прикручу нужное, выправлю кривое. Вытравлю вредителей.

X

279

Xubart

26 апреля 2019, 09:15

#4

:(

Походу, что то не так делаю... :(

S

469

Sitealert

26 апреля 2019, 09:41

#5

Ну смотрите, что там в консоли написано.

Наверняка что-нибудь типа Tygh undefined.

X

279

Xubart

26 апреля 2019, 09:47

#6

Uncaught ReferenceError: Tygh is not defined

и указывает на строку:

})(Tygh, Tygh.$);

Все что нужно знать о DDоS-атаках грамотному менеджеру

VK приобрела 70% в структуре компании-разработчика red_mad_robot