Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 03.11.2016, 00:18
Аспирант
Отправить личное сообщение для maxapet Посмотреть профиль Найти все сообщения от maxapet
 
Регистрация: 27.08.2015
Сообщений: 43

Как позиционировать кнопку?
Есть некая форма, которую настраивает пользователь. Элементы на форме расположены вертикально в ряд. Определённую часть формы пользователь может скрывать при настройке, при этом форма по вертикали поджимается, а справа от формы нужно отображать значок-кнопку, которая будет показывать, что есть скрытый элемент. Щелчок по этой кнопке возвращает скрытый элемент и убирает её самое.
Собственно, вопрос: как позиционировать эту кнопу так, чтобы она появлялась справа от формы между предыдущим и последующим элементами скрытого элемента?
На ум не приходит ничего, кроме объявления значка position: absolute, и вычисления позиции значка-кнопки через position и offset (использую jQuery). Но может быть, у кого-то есть более простое решение? Поделитесь, pls.
Ответить с цитированием
  #2 (permalink)  
Старый 03.11.2016, 00:46
Аватар для Aetae
Тлен
Отправить личное сообщение для Aetae Посмотреть профиль Найти все сообщения от Aetae
 
Регистрация: 02.01.2010
Сообщений: 6,469

Значок с position:absolute но без указания top\bottom, а только right вставленный перед\после скрытого элемента, например.
__________________
29375, 35
Ответить с цитированием
  #3 (permalink)  
Старый 03.11.2016, 01:00
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,050

maxapet, по клику
заменить элемент пустышкой с css :after и наоборот
Ответить с цитированием
  #4 (permalink)  
Старый 04.11.2016, 16:16
Аспирант
Отправить личное сообщение для maxapet Посмотреть профиль Найти все сообщения от maxapet
 
Регистрация: 27.08.2015
Сообщений: 43

Не понял, объясните, пожалуйста.
Ответить с цитированием
  #5 (permalink)  
Старый 04.11.2016, 16:52
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,050

maxapet,
кликнуть по любому input, потом по restore
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  form{
    width: 300px;
    height: 300px;
    border: dashed 2px #FF0000;
  }
  div{
    position: relative;
  }
  div.add{
    height: 1px;
    widows: 100%;
    background-color: #FF0000;
  }

  .add:after {
      content: "restore";
      position: absolute;
       right: -65px;
     top: -23px;

  }

  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
   <script>
$(function() {
   $('div').on('click',function() {
   var html = $(this).html();
   var data = $(this).data('html')||'';
   $(this).html(data).toggleClass('add');
   $(this).data('html', html)
})
});
  </script>
</head>

<body>
<form action="http://">
<div><input name=""></div>
<div><input name=""></div>
<div><input name=""></div>
<div><input name=""></div>
</form>


</body>
</html>
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как зделать такую фишку нажать на кнопку и чтобы высветило привет ??? mocaua Мобильный JavaScript 3 25.02.2014 20:55
Как вы относитесь к наркоманам? Maxmaxmaximus7 Оффтопик 7 05.02.2014 12:29
Как сделать кнопку "На верх" dimaan777 jQuery 7 08.05.2011 14:16
Как сделать кнопку, запускающую rrdtool jsx Общие вопросы Javascript 2 20.02.2011 13:40
Как сделать, чтобы при наведении на кнопку справа от нее появлялись текстовые ссылки? Tass Общие вопросы Javascript 7 17.02.2011 09:06