Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 19.11.2021, 07:46
Профессор
Отправить личное сообщение для Сергей Ракипов Посмотреть профиль Найти все сообщения от Сергей Ракипов
 
Регистрация: 01.06.2010
Сообщений: 651

Дополнить код
<!DOCTYPE html>
<html lang="ru_RU">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <style>
        .box {
            cursor: pointer;
            font-size: 24px;
            display: block;
        }

        .box2 {
            color: blue;
            font-size: 24px;
            display: block;
        }
    </style>
    <script>
        jQuery( document ).ready( function ( $ ) {
            $( '.box' ).hover( function () {
                // навели мышь на элемент
                $( '.box2' ).css( 'color', 'red' );
            }, function () {
                // убрали мышь с элемента
                $( '.box2' ).css( 'color', '' );
            } );
        } );
    </script>
</head>
<body>
    <div>
        <p class="box">Какой то текст</p>
    </div>
    <div>
        <p class="box2">Элемент</p>
    </div>
</body>
</html>


Дополнить код, что бы когда разрешение экрана было меньше 640px
то при наведении .box то .box2 менял цвет orange а когда убрали курсор с .box при разрешение меньше 640 то .box2 менял на цвет blue
Ответить с цитированием
  #2 (permalink)  
Старый 19.11.2021, 08:38
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,118

Сообщение от Сергей Ракипов
когда разрешение экрана было меньше 640px
Вот тебе статейка...
https://habr.com/ru/post/509258/
Ответить с цитированием
  #3 (permalink)  
Старый 19.11.2021, 08:53
Профессор
Отправить личное сообщение для Сергей Ракипов Посмотреть профиль Найти все сообщения от Сергей Ракипов
 
Регистрация: 01.06.2010
Сообщений: 651

ksa,
Я могу сделать на обычном js но я не знаю правил написание синтаксиса на jQ
Ответить с цитированием
  #4 (permalink)  
Старый 19.11.2021, 08:58
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,118

Сообщение от Сергей Ракипов
я не знаю правил написание синтаксиса на jQ
Оно аналогичное...
https://jquery-docs.ru/click/
Ответить с цитированием
  #5 (permalink)  
Старый 19.11.2021, 09:00
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,118

Сергей Ракипов, вот русский вариант...
https://basicweb.ru/jquery/jquery_event_click.php
Ответить с цитированием
  #6 (permalink)  
Старый 19.11.2021, 09:02
Профессор
Отправить личное сообщение для Сергей Ракипов Посмотреть профиль Найти все сообщения от Сергей Ракипов
 
Регистрация: 01.06.2010
Сообщений: 651

ksa,
Так у меня это написано в коде, мне в этом коде не хватает условий max-width
Ответить с цитированием
  #7 (permalink)  
Старый 19.11.2021, 09:25
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,118

Сообщение от Сергей Ракипов
мне в этом коде не хватает условий max-width
Т.е. ты не умеешь применять "условное ветвление"?
https://learn.javascript.ru/ifelse
Ответить с цитированием
  #8 (permalink)  
Старый 19.11.2021, 09:29
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,118

Что-то про click я явно не в ту тему написал...
Там у камрада кликать на капчу не получалось.

Сергей Ракипов, вот тебе вариант про разрешение на jQ...
http://bologer.ru/poluchit-vysotu-i-...rana-s-jquery/

Правда я не пойму зачем именно на jQ это все определять. Тебя кто-то так заставляет?
Ответить с цитированием
  #9 (permalink)  
Старый 19.11.2021, 09:50
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Сергей Ракипов,
// навели мышь на элемент
                $( '.box2' ).css( 'color', window.matchMedia('(min-width: 640px)').matches  ? 'red' : 'orange');
Ответить с цитированием
  #10 (permalink)  
Старый 19.11.2021, 10:05
Профессор
Отправить личное сообщение для Сергей Ракипов Посмотреть профиль Найти все сообщения от Сергей Ракипов
 
Регистрация: 01.06.2010
Сообщений: 651

Сообщение от ksa Посмотреть сообщение
Что-то про click я явно не в ту тему написал...
Тебя кто-то так заставляет?
говорят если научится пользоваться этим библиотеками будет проще
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
есть исходный код. добавить несколько функций на стороне клиента+ сервер masha1 Работа 1 27.03.2018 10:32
Помогите дополнить код — задержка события removeClass Vladislav0140 Общие вопросы Javascript 2 28.11.2016 21:39
Как найти и заменить код скрипта на странице на другой код? smls Общие вопросы Javascript 2 18.07.2016 22:01
"Оживите" код с хабра - https://habrahabr.ru/sandbox/51453/ Daniil2206 Node.JS 0 11.05.2016 18:09
Требуется выводить код рекламного блока Adsense из файла JavaScript??? speedflow Элементы интерфейса 0 26.05.2012 15:50