Как выделять текст?

Question

opsimecom @opsimecom

HTML
CSS

Как выделять текст?

Здравствуйте! Возникла сложность. Есть такая всплывающая подсказка при наведение на текст. Как сделать чтобы можно было выделить текст в этой иконке и скопировать например его?

Вод css

.pudskasgen{
  cursor:help;
  position:relative;
}

.pudskasgen::before,
.pudskasgen::after{
  position:absolute;
  left:50%;
  opacity:0;
  z-index:-100;
}

.pudskasgen:hover::before,
.pudskasgen:focus::before,
.pudskasgen:hover::after,
.pudskasgen:focus::after{
  opacity:1;
  z-index:100;
  transform:scale(1) translateY(0);
}

.pudskasgen::before {
  border-style: solid;
  border-width: 1em .75em 0 .75em;
  border-color: #22292f rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) transparent;
  bottom: 100%;
  margin-left: -.5em;
  content: "";
  transform: scale(.6) translateY(-90%);
  transition: all .6s cubic-bezier(.85, -.18, .31, 1.26), opacity .65s .5s;
}

.pudskasgen:hover::before,
.pudskasgen:focus::before{
  transition-delay:.2s;
}

.pudskasgen::after {
  background: #22292f;
  border-radius: .25em;
  bottom: 180%;
  color: #e0e3e4;
  width: 253px;
  padding: 1.3em;
  margin-left: -8em;
  content: attr(data-tip);
  transform: scale(.6) translateY(50%);
  transition: all .65s cubic-bezier(.84, -.18, .31, 1.26) .2s;
}

.pudskasgen:hover::after,
.pudskasgen:focus::after{
  transition-delay:0s;
}

Вопрос задан более трёх лет назад
68 просмотров

4 комментария

Подписаться 1 Простой 4 комментария

Danny Arty @DanArst Куратор тега CSS

имеете в виду выделить текст всплывающей подсказки?

Написано более трёх лет назад
Nurdaulet Maksutov @maksutovn

Без js никак

Написано более трёх лет назад
opsimecom @opsimecom Автор вопроса

Danny Arty, да, не понимаю как сделать так чтобы ее можно было выделить

Написано более трёх лет назад

opsimecom @opsimecom Автор вопроса

нашел решение здесь jsfiddle.net/ostapische/4GHGF
Все ок работает в html файле
а как сделать в php файле такого формата ?

<!DOCTYPE html>
<html lang="ru">
 <head>
   <title>поиск</title>
    <meta charset="UTF-8" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
	<script src="js/readmore.js"></script>
	<script>
		$('article').readmore({
			maxHeight: 50,
			moreLink: '<a href="#">Развернуть текст</a>',
			lessLink: '<a href="#">Свернуть текст</a>'
		});
	</script>
	<style>


	</style>
   </head>
   <body>
 
  

  </body>
</html>



<?php

// Кол-во элементов
$limit = 12; 
 
// Подключение к БД

define('DB_NAME', '');
define('DB_USER', '');
define('DB_PASSWORD', '');
define('DB_HOST', 'localhost');

$dbh = new PDO  ( "mysql:host=" . DB_HOST  ."; charset=utf8; dbname=" . DB_NAME, DB_USER, DB_PASSWORD); 
// Получение записей для текущей страницы

$page = intval(@$_GET['page']);
$page = (empty($page)) ? 1 : $page;				
$start = ($page != 1) ? $page * $limit - $limit : 0;
$sth = $dbh->prepare("SELECT * FROM `products` LIMIT {$start}, {$limit}");
$sth->execute();	
$items = $sth->fetchAll(PDO::FETCH_ASSOC);				



	
foreach ($items as $row) {

	?>

	 <div class ="brd2">
          <?=$row['product_id']?> // сюда надо впихнуть функцию
         </div>
	<?php

}

Написано более трёх лет назад

Пригласить эксперта

Ответы на вопрос 1

Комментировать

Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации

Похожие вопросы

JavaScript

+2 ещё

Средний
Как отсортировать в ХТМЛ по дате рождения от младшего к старшему, а так же, нумерацию их 1,2,3,4. Чтобы можно было потом добавить еще людей?
- 1 подписчик
- 57 минут назад
- 18 просмотров
1

ответ
HTML

+1 ещё

Простой
При загрузке картинки этот блок не имеет размера, как исправить?
- 1 подписчик
- 4 часа назад
- 36 просмотров
0

ответов
JavaScript

+2 ещё

Простой
Пустая страница, ошибок нет. JS. В чем проблема?
- 1 подписчик
- 5 часов назад
- 143 просмотра
1

ответ
CSS

Простой
Как убрать отступ?
- 1 подписчик
- 7 часов назад
- 87 просмотров
2

ответа
HTML

+1 ещё

Простой
Как кодировать кириллицу в поле data?
- 1 подписчик
- 10 часов назад
- 39 просмотров
1

ответ
HTML

+1 ещё

Простой
Как в теге select один символ сделать другого цвета?
- 1 подписчик
- 16 часов назад
- 84 просмотра
1

ответ
CSS

Простой
Как уместить кроссбраузерную поддержку в одну строку?
- 1 подписчик
- 16 часов назад
- 101 просмотр
1

ответ
HTML

+1 ещё

Простой
Как поставить элементы в одну строку и выровнять их?
- 1 подписчик
- вчера
- 79 просмотров
1

ответ
HTML

+1 ещё

Простой
Почему не работает pattern на input?
- 1 подписчик
- вчера
- 87 просмотров
2

ответа
CSS

+1 ещё

Простой
Как стилизовать пагинацию постов по определённому признаку?
- 1 подписчик
- вчера
- 74 просмотра
1

ответ
Показать ещё Загружается…

Frontend-разработчик (React)

ДАЛЕЕ

от 130 000 ₽

Тестировщик-стажёр

ITooLabs • Тула

от 35 000 до 40 000 ₽

Fullstack PHP Developer

Smapse Education

от 40 000 до 65 000 ₽

Доработать клиентское приложение для GTA 5 на C#

20 апр. 2024, в 00:51

1000 руб./за проект

Верстка и логика формы выбора билетов в зале для покупки

20 апр. 2024, в 00:43

10000 руб./за проект

Разработать формирование УПД на Java

20 апр. 2024, в 00:28

20000 руб./за проект

имеете в виду выделить текст всплывающей подсказки?
Danny Arty, да, не понимаю как сделать так чтобы ее можно было выделить
нашел решение здесь jsfiddle.net/ostapische/4GHGF
Все ок работает в html файле
а как сделать в php файле такого формата ?

<!DOCTYPE html> <html lang="ru"> <head> <title>поиск</title> <meta charset="UTF-8" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script src="js/readmore.js"></script> <script> $('article').readmore({ maxHeight: 50, moreLink: '<a href="#">Развернуть текст</a>', lessLink: '<a href="#">Свернуть текст</a>' }); </script> <style> </style> </head> <body> </body> </html> <?php // Кол-во элементов $limit = 12; // Подключение к БД define('DB_NAME', ''); define('DB_USER', ''); define('DB_PASSWORD', ''); define('DB_HOST', 'localhost'); $dbh = new PDO ( "mysql:host=" . DB_HOST ."; charset=utf8; dbname=" . DB_NAME, DB_USER, DB_PASSWORD); // Получение записей для текущей страницы $page = intval(@$_GET['page']); $page = (empty($page)) ? 1 : $page; $start = ($page != 1) ? $page * $limit - $limit : 0; $sth = $dbh->prepare("SELECT * FROM `products` LIMIT {$start}, {$limit}"); $sth->execute(); $items = $sth->fetchAll(PDO::FETCH_ASSOC); foreach ($items as $row) { ?> <div class ="brd2"> <?=$row['product_id']?> // сюда надо впихнуть функцию </div> <?php }

Answer 1 · 2021-02-23 10:54:50

https://developer.mozilla.org/en-US/docs/Mozilla/A...

Или вам нужно сделать этот блок отдельным div, при наведении который будет появляться относительно этого блока, и уже с ним взаимодействовать

Как выделять текст?

Войдите, чтобы написать ответ

Минуточку внимания

Войдите на сайт