Добро пожаловать на ИТ форум!

После быстрой регистрации у вас будет возможность участвовать в дискуссиях, создавать новые посты, и еще много чего.

Регистрация

Как реализовать появление кнопок «отправить» и т.д. при наведении на картинку

PushustuiKotik

New Member
Регистрация
14.05.2020
Сообщения
2
Доброго времени суток! Я начинающий верстальщик. Верстаю по макетам. Возник вопрос как при наведении на картинку реализовать появление этих кнопок? (То есть как добавить сами иконки понятно), но как сделать их функциональными? Чтобы действительно можно было скопировать ссылку/поставить лайк. Нужен ли js? Можно ли реализовать это на плагине? Всем спасибо!
 

Вложения

BaNru

Пацифизжу
Регистрация
13.11.2010
Сообщения
3 900
Да, обязательно нужен JS.
Что подразумевается по плагином?

Готовая функция выглядит примерно так
JavaScript:
function copyContent(text){
    const input = document.createElement('input');
    input.style.position = 'fixed';
    input.style.opacity = 0;
    input.value = text;
    document.body.appendChild(input);
    input.select();
    let result =  document.execCommand('Copy', false, null);
    document.body.removeChild(input);
    return result;
}
В эту функцию передаём необходимый текст и он копируется в буфер
Для вашей кнопочки он получится примерно вот так (самый простой вариант)
HTML:
<span onclick="copyContent('ссылка')"></span>

Конечно можно добавить всякие уведомления типа "скопировано", но это на данном этапе усложнит функцию.
 

PushustuiKotik

New Member
Регистрация
14.05.2020
Сообщения
2
Да, обязательно нужен JS.
Что подразумевается по плагином?

Готовая функция выглядит примерно так
JavaScript:
function copyContent(text){
    const input = document.createElement('input');
    input.style.position = 'fixed';
    input.style.opacity = 0;
    input.value = text;
    document.body.appendChild(input);
    input.select();
    let result =  document.execCommand('Copy', false, null);
    document.body.removeChild(input);
    return result;
}
В эту функцию передаём необходимый текст и он копируется в буфер
Для вашей кнопочки он получится примерно вот так (самый простой вариант)
HTML:
<span onclick="copyContent('ссылка')"></span>

Конечно можно добавить всякие уведомления типа "скопировано", но это на данном этапе усложнит функцию.
Спасибо огромное!
 
Верх Низ