0 / 0 / 0
Регистрация: 28.11.2015
Сообщений: 1
1

Код работает, но не так как надо

28.11.2015, 22:22. Показов 646. Ответов 1
Метки нет (Все метки)

Здравствуйте.
Нужно, чтобы строка поиска увеличивалась в длине от 0px до 130px при нажатии кнопки. При нажатии строка прибавляет 130px, но сразу же возвращается в исходное состояние 0px. Подскажите пожалуйста мне, нубу, как сделать так, чтобы она разворачивалась и сворачивалась ТОЛЬКО ПРИ КЛИКЕ.

JS
Javascript
1
2
3
4
5
6
7
8
9
10
11
$(document).ready(function(){
            $('#lup').click(function(event) {
                $('#searcher_r')
                .animate({right: "0", width: "130px"}, 500);
            });
            $("#lup").click(function(){
                $('#searcher_r')
                .animate({right: "0", width: "0px"}, 500);
            });
 
 });
CSS
CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
#lup{
    margin-left: 1520px;
    margin-top: -30px;
    cursor: pointer;
}
#searcher{
    z-index: 111;
    position: absolute;
    left: 1520px;
    top: 103px;
    width: 135px;
    height: 15px;
}
#searcher_r{
    width: 0px;
    border-radius: 11px;
    position: relative;
}
HTML
HTML5
1
2
3
4
5
6
7
<div id="lup">
   <img src="https://www.cyberforum.ru/images/lup.png">
 </div> 
 
<div  id="searcher">
    <input type="text" id="searcher_r" placeholder="  Поиск...">
 </div>
__________________
Помощь в написании контрольных, курсовых и дипломных работ, диссертаций здесь
0
Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
28.11.2015, 22:22
Ответы с готовыми решениями:

GetJson работает не так, как надо
$.getJSON('mark.php', function(data) { $.each(data, function(lat, lng){ var marker = new...

Код работает не так, как надо
Нужно ввести строку и слово и чтобы выводились порядковые номера слов в строке, совпадающих с...

Код работает не так, как надо
Нужно ввести строку и слово и чтобы выводились порядковые номера слов в строке, совпадающих с...

Работает не так как надо
я ввожу ааа - выводит qqq а должен выводить qaz что нужно поменять? хотя бы на примере первого...

1
347 / 322 / 203
Регистрация: 27.06.2014
Сообщений: 762
29.11.2015, 08:41 2
PHP/HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
<html>
<head>
<script>
    function increaseSearch (button, text, len) {
        var btn   = typeof button === "string" ? document.querySelector (button) : button,
            t     = typeof text === "string"   ? document.querySelector (text) : text,
            l     = typeof len !== "undefined" ? len : 135,
            p     = parseInt (getComputedStyle (t)["padding"]),
            b     = getComputedStyle (t)["border"],
            css   = function (e, css) {for (var i in css) {e.style[i] = css[i];}},
            click = function () {
                css (t, t.offsetWidth === 0 ? {width: l + "px", padding: p + "px", border: b} :
                        {width: 0 + "px", padding: 0 + "px", border: 0});
            };
 
        btn.addEventListener ("click", click);
    }
 
    window.addEventListener ("load", function () {
        // increaseSearch ("селектор кнопки", "селектор текстового поля", желаемая ширина текстового поля);
        increaseSearch ("#btn", "#searcher_r");
    });
</script>
</head>
<body>
<input type="button" id="btn" value="click">
 
        <div id="searcher">
            <input type="text" id="searcher_r" placeholder=" Поиск...">
        </div>
</body>
</html>
0
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
29.11.2015, 08:41
Помогаю со студенческими работами здесь

Работает не так как надо(классы)
Задача. Создать класс хранящий в себе инн. Проверить его на верность и вывести результат. class...

Почему не работает так как надо
#include &lt;vcl.h&gt; #pragma hdrstop #include &quot;Unit1.h&quot;...

Find работает не так как надо
Здравствуйте, как правильно решить систему уравнений? PTC Mathcad Prime 3.1

Почему работает не так как надо?
В общем вот в чем вопрос, есть код на СИ. Задача такова ввести с клавы день, месяц, год рождения...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
2
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2023, CyberForum.ru