За последние 24 часа нас посетили 19627 программистов и 1604 робота. Сейчас ищут 1784 программиста ...

Форма поиска с эффектом

Тема в разделе "Сделайте за меня", создана пользователем Виктор К., 14 апр 2016.

  1. Виктор К.

    Виктор К. Новичок

    С нами с:
    1 апр 2016
    Сообщения:
    139
    Симпатии:
    6
    Адрес:
    Украина
    Здраствуйте. Нужна ваша помощь для реализации формы поиска. Примерно как на appleinsider.ru, но расположенная слева.
    Смог сделать просто увеличение поля при клике и уменьшение при повторном. Но нужно нечто другое:
    1. При клике по изображению (значок поиска) разворачивается поле, при этом смещается значок (как на выше упомянутом сайте).
    2. Если в поле что-либо введено, при клике по значку идет переход по ссылке собственно для поиска, а если пустая, то при клике в любую точку екрана она сворачивается.
    Дело в том, что JavaScript только начинаю учить, поэтому прошу помочь конкретным решение, думаю многим это потом тоже пригодится.

    Не знаю зачем, но вот код:
    Код (Text):
    1. <a href="/search"><img class="search" src="/resource/images/design/search.png"/></a>
    2. <form id="search-form"  action="/search">
    3.         <input id="search-field" name="search-field">              
    4.     </form>
     
  2. mr.akv

    mr.akv Активный пользователь

    С нами с:
    31 мар 2015
    Сообщения:
    1.604
    Симпатии:
    206
    Ты у нас не первый день на форуме. Вроде уже должен знать, как это работает. Нахаляву никто помогать не будет. Варианта два:
    1. Заплатить деньги
    2. Просить помочь. Но в этом случае опять же нужна оплата. Тут помогают, если знают, что от помощи у тебя самого в мозгах что-то прибавиться. Если тупо сделать за тебя - нихрена у тебя н прибавиться. А значит люди поработали зазря.
    Покажи, что ты что-то пытался сам сделать, что-то не понял. Помогут, объяснят.
     
  3. TeslaFeo

    TeslaFeo Старожил

    С нами с:
    9 мар 2016
    Сообщения:
    2.984
    Симпатии:
    759
    ставь себе под задачи. сделай чтобы развернутьлось, а потом, чтобы свернулось. Потом дай картинке ID и в JQuery повесь на собитие клика по картинке разворот ( и там я так понимаю какое то поле ввода должно быть которое должно получить фокус ). а на событие потери фокуса повесь свертывание твоего поля. Делай всё постепенно. И всё получится.... удачи :)
     
  4. Виктор К.

    Виктор К. Новичок

    С нами с:
    1 апр 2016
    Сообщения:
    139
    Симпатии:
    6
    Адрес:
    Украина
    Спасибо, проблемы возникли именно в построении алгоритма))