Перейти до вмісту
Пошук в
  • Детальніше...
Шукати результати, які ...
Шукати результати в ...

Ховаємо опис категорії прямо в редакторі


Kamaz

Recommended Posts

Всім привіт

 

Підкажіть, що ще не вистачає щоб сховати частину категорії під кнопку? Ось сам код:

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
  $("#hide").click(function(){
    $("p").hide();
  });
  $("#show").click(function(){
    $("p").show();
  });
});
</script>
</head>
<body>

<p>If you click on the "Hide" button, I will disappear.</p>

<button id="hide">Hide</button>
<button id="show">Show</button>

</body>
</html>

 

При вставлені в CKeditor опис частково ховає, але при цьому не хоче відразу ховати. Що йому не вистачає щоб відразу ховало текст?

 

От приклад:

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
  $("#hide").click(function(){
    $("pz").hide();
  });
  $("#show").click(function(){
    $("pz").show();
  });
});
</script>
</head>
<body>
<div style="text-align: justify;"><span style="font-family:georgia,serif;"><span style="font-size:12px;"><span style="color:#000000;">Плануєте ремонт чи будівництво великого масштабу? Магазин будівельних матеріалів DarkShop готовий допомогти вам знаходити всі необхідні компоненти для реалізації вашої найсміливішої, оригінальної та цікавої архітектурної ідеї. Замовляйте будівельні матеріали без виходу з дому, просто переглянувши наш каталог та додавши потрібне до віртуального кошика - від гіпсокартонних блоків до декоративних покриттів. Ми гарантуємо консультаційну підтримку, надаємо докладну інформацію про кожен товар та доставляємо покупки прямо до ваших дверей у будь-яку точку України.</span></span></span></div>

<pz>
<div style="text-align: justify;"><span style="font-family:georgia,serif;"><span style="font-size:12px;"><span style="color:#000000;">DarkShop більше 10 років виступає надійним партнером будівництва та ремонту! Офіційний дистриб&#39;ютор великої кількості провідних виробників будівельних матеріалів зі всього світу. Будівельні блоки, цегла, суміші, матеріали для покрівлі, столярні і оздоблювальні матеріали (барвники, вапно, грунтівка, фарби і емалі, лаки, промислові клеї, садова фарба, шпаклівка по дереву та інші) доступні вам з оптових складів 24/7.</span></span></span></div>
</pz>

<button id="hide">Hide</button>
<button id="show">Show</button>

</body>
</html>

 

Надіслати
Поділитися на інших сайтах


15.04.2024 в 16:04, Kamaz сказал:

Всім привіт

 

Підкажіть, що ще не вистачає щоб сховати частину категорії під кнопку? Ось сам код:

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
  $("#hide").click(function(){
    $("p").hide();
  });
  $("#show").click(function(){
    $("p").show();
  });
});
</script>
</head>
<body>

<p>If you click on the "Hide" button, I will disappear.</p>

<button id="hide">Hide</button>
<button id="show">Show</button>

</body>
</html>

 

При вставлені в CKeditor опис частково ховає, але при цьому не хоче відразу ховати. Що йому не вистачає щоб відразу ховало текст?

 

От приклад:

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
  $("#hide").click(function(){
    $("pz").hide();
  });
  $("#show").click(function(){
    $("pz").show();
  });
});
</script>
</head>
<body>
<div style="text-align: justify;"><span style="font-family:georgia,serif;"><span style="font-size:12px;"><span style="color:#000000;">Плануєте ремонт чи будівництво великого масштабу? Магазин будівельних матеріалів DarkShop готовий допомогти вам знаходити всі необхідні компоненти для реалізації вашої найсміливішої, оригінальної та цікавої архітектурної ідеї. Замовляйте будівельні матеріали без виходу з дому, просто переглянувши наш каталог та додавши потрібне до віртуального кошика - від гіпсокартонних блоків до декоративних покриттів. Ми гарантуємо консультаційну підтримку, надаємо докладну інформацію про кожен товар та доставляємо покупки прямо до ваших дверей у будь-яку точку України.</span></span></span></div>

<pz>
<div style="text-align: justify;"><span style="font-family:georgia,serif;"><span style="font-size:12px;"><span style="color:#000000;">DarkShop більше 10 років виступає надійним партнером будівництва та ремонту! Офіційний дистриб&#39;ютор великої кількості провідних виробників будівельних матеріалів зі всього світу. Будівельні блоки, цегла, суміші, матеріали для покрівлі, столярні і оздоблювальні матеріали (барвники, вапно, грунтівка, фарби і емалі, лаки, промислові клеї, садова фарба, шпаклівка по дереву та інші) доступні вам з оптових складів 24/7.</span></span></span></div>
</pz>

<button id="hide">Hide</button>
<button id="show">Show</button>

</body>
</html>

 

У вас 2 события объявлено для клика
$("#hide").click(function(){
    $("pz").hide();
  });
  и 

 

$("#show").click(function(){
    $("pz").show();
  });

 

Нужно добавить отдельно $("pz").hide();

Что бы выполнялось скрытие при загрузке страницы

Надіслати
Поділитися на інших сайтах

<p id="my_text">If you click on the "Hide" button, I will disappear.</p>

<button id="hide">Hide</button>
<button id="show">Show</button>

 

$(document).ready(function(){
    // Скрываем текст и кнопку при загрузке страницы
    $('#my_text, #hide').hide();

    // Скрываем текст и кнопку при клике на кнопку "Hide"
    $('#hide').click(function(){
        $('#my_text, #hide').hide();
        $('#show').show();
    });

    // Показываем текст при клике на кнопку "Show"
    $('#show').click(function(){
        $('#my_text, #hide').show();
        $('#show').hide();
    });
});

 

 

  • +1 1
Надіслати
Поділитися на інших сайтах

15.04.2024 в 17:35, Speaker12 сказал:
<p id="my_text">If you click on the "Hide" button, I will disappear.</p>

<button id="hide">Hide</button>
<button id="show">Show</button>

 

$(document).ready(function(){
    // Скрываем текст и кнопку при загрузке страницы
    $('#my_text, #hide').hide();

    // Скрываем текст и кнопку при клике на кнопку "Hide"
    $('#hide').click(function(){
        $('#my_text, #hide').hide();
        $('#show').show();
    });

    // Показываем текст при клике на кнопку "Show"
    $('#show').click(function(){
        $('#my_text, #hide').show();
        $('#show').hide();
    });
});

 

 

Дякую, зараз буду тестити

Надіслати
Поділитися на інших сайтах


15.04.2024 в 17:36, Kamaz сказал:

Дякую, зараз буду тестити

https://jsfiddle.net/r1a90d6z/12/

  • +1 1
Надіслати
Поділитися на інших сайтах

Код, якщо хтось хоче зробити прямо з редактора. Протестив - працює. дякую @Speaker12

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $('#my_text, #hide').hide();
    $('#hide').click(function(){
        $('#my_text, #hide').hide();
        $('#show').show();
    });
    $('#show').click(function(){
        $('#my_text, #hide').show();
        $('#show').hide();
    });
});
</script>
</head>
<body>
<div style="text-align: justify;"><span style="font-family:georgia,serif;"><span style="font-size:12px;"><span style="color:#000000;">Плануєте ремонт чи будівництво великого масштабу? Магазин будівельних матеріалів DarkShop готовий допомогти вам знаходити всі необхідні компоненти для реалізації вашої найсміливішої, оригінальної та цікавої архітектурної ідеї. Замовляйте будівельні матеріали без виходу з дому, просто переглянувши наш каталог та додавши потрібне до віртуального кошика - від гіпсокартонних блоків до декоративних покриттів. Ми гарантуємо консультаційну підтримку, надаємо докладну інформацію про кожен товар та доставляємо покупки прямо до ваших дверей у будь-яку точку України.</span></span></span></div>

<p id="my_text"> DarkShop більше 10 років виступає надійним партнером будівництва та ремонту! Офіційний дистриб&#39;ютор великої кількості провідних виробників будівельних матеріалів зі всього світу. Будівельні блоки, цегла, суміші, матеріали для покрівлі, столярні і оздоблювальні матеріали (барвники, вапно, грунтівка, фарби і емалі, лаки, промислові клеї, садова фарба, шпаклівка по дереву та інші) доступні вам з оптових складів 24/7.</p>

<button id="hide">Менше</button>
<button id="show">Детальніше</button>

</body>
</html>

 

Надіслати
Поділитися на інших сайтах


15.04.2024 в 17:48, Kamaz сказал:

Код, якщо хтось хоче зробити прямо з редактора. Протестив - працює. дякую @Speaker12

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $('#my_text, #hide').hide();
    $('#hide').click(function(){
        $('#my_text, #hide').hide();
        $('#show').show();
    });
    $('#show').click(function(){
        $('#my_text, #hide').show();
        $('#show').hide();
    });
});
</script>
</head>
<body>
<div style="text-align: justify;"><span style="font-family:georgia,serif;"><span style="font-size:12px;"><span style="color:#000000;">Плануєте ремонт чи будівництво великого масштабу? Магазин будівельних матеріалів DarkShop готовий допомогти вам знаходити всі необхідні компоненти для реалізації вашої найсміливішої, оригінальної та цікавої архітектурної ідеї. Замовляйте будівельні матеріали без виходу з дому, просто переглянувши наш каталог та додавши потрібне до віртуального кошика - від гіпсокартонних блоків до декоративних покриттів. Ми гарантуємо консультаційну підтримку, надаємо докладну інформацію про кожен товар та доставляємо покупки прямо до ваших дверей у будь-яку точку України.</span></span></span></div>

<p id="my_text"> DarkShop більше 10 років виступає надійним партнером будівництва та ремонту! Офіційний дистриб&#39;ютор великої кількості провідних виробників будівельних матеріалів зі всього світу. Будівельні блоки, цегла, суміші, матеріали для покрівлі, столярні і оздоблювальні матеріали (барвники, вапно, грунтівка, фарби і емалі, лаки, промислові клеї, садова фарба, шпаклівка по дереву та інші) доступні вам з оптових складів 24/7.</p>

<button id="hide">Менше</button>
<button id="show">Детальніше</button>

</body>
</html>

 

 

Мінус такого коду якщо використаєте прямо в описі - заблокує виконання інших скриптів. Тому мабуть, щоб це стало робочим рішенням потрібно проипсати це штатно в код.

Надіслати
Поділитися на інших сайтах


Створіть аккаунт або увійдіть для коментування

Ви повинні бути користувачем, щоб залишити коментар

Створити обліковий запис

Зареєструйтеся для отримання облікового запису. Це просто!

Зареєструвати аккаунт

Вхід

Уже зареєстровані? Увійдіть тут.

Вхід зараз
  • Зараз на сторінці   0 користувачів

    • Ні користувачів, які переглядиють цю сторінку
×
×
  • Створити...

Important Information

На нашому сайті використовуються файли cookie і відбувається обробка деяких персональних даних користувачів, щоб поліпшити користувальницький інтерфейс. Щоб дізнатися для чого і які персональні дані ми обробляємо перейдіть за посиланням . Якщо Ви натиснете «Я даю згоду», це означає, що Ви розумієте і приймаєте всі умови, зазначені в цьому Повідомленні про конфіденційність.