Это небольшой javascript позволит при необходимости скрывать и показывать при нажатии на ссылку фрагменты текста и картинки. Это может понадобиться, когда вы захотите описать совсем уж тривиальные вещи, которые многие знают. И чтобы большинство читателей не отвлекалось на эту информацию, предоставить её лишь при нажатии на ссылку. Таким же образом можно скрыть картинку и вообще любой фрагмент. Или реализовать вопросник, где при нажатии на конкретный вопрос будет раскрываться конкретный ответ.

Сначала приведу пример, затем скрипт и пояснения.

Пример Код:

Всегда ли это будет работать?

Посмотреть розового слоника

Вот реализация данного фрагмента (жмите на ссылки):

Будет работать, если пользователь в своём браузере сознательно не отключил использование джаваскриптов. Все современные темы Wodpress с галереями и эффектами работают не без помощи JavaScript. Да и многие современные сайты используют эту технологию.

Скрипт

Нам понадобится небольшая функция show_hide().

function show_hide(obj_id) {
doc= document.getElementById(obj_id) ;
if(doc.style .display == "none" ) doc.style .display = "block" ;
else doc.style .display = "none"
}

Для WordPress функцию show_hide() можно разместить в файле header.php перед закрывающимся тегом , заключив её в теги и . Или разместить в подключаемом js-файле.

Подробнее

А скрываемый фрагмент помещаем в div

Подробности

Скрываемый фрагмент должен быть заключён в свой div c уникальным в пределах страницы id (здесь id="detail" ) и стилем display:none (который говорит браузеру, чтобы не отображал содержимое). При загрузке страницы этот скрываемый фрагмент загрузится в браузер, будет индексироваться поисковыми системами, только будет скрыт до тех пор, пока пользователь сознательно не нажмёт на ссылку Подробнее , где прописан вызов нашей функции show_hide . В качестве параметра в функцию передаётся значение id скрываемого div’а. Функция меняет свойство display с none на block и обратно. Что приводит к показу и скрытию фрагмента в div’е.

В случае с картинкой можно позаботиться о тех немногочисленных пользователях, у которых всё-таки отключён javascript, показав им картинку в другом окне. Нам же известен адрес картинки. Поэтому ссылку на картинку вида:

Посмотреть розового слоника

лучше переписать так:

Посмотреть розового слоника

При включенном джаваскрипте вы не увидите изменений. Зато при отключённом вместо нерабочей ссылки перед вами откроется картинка в новом окне.

Хотелось ли Вам когда-нибудь спрятать от посторонних людей на своей страничке скрипт, который реализует нереально красивое появление меню или выполнение других действий, которые Вы бы не хотели видеть в скором времени на каждом втором сайте?
Если да, то способ изложенный в этой статье Вам пригодится совместно с обфускацией кода. При этом оговорюсь сразу, что способ не 100-процентный, но от большинства непрофессионалов и части профессионалов он возможно защитит.

Теория Допустим у нас есть страничка nojs.php, а на ней скрипт secret.js, который надо спрятать. Браузер и пользователь могут получить скрипт с сервера следующими путями:
  • Загрузка скрипта непосредственно размещенного на странице или подгруженного с помощью DOM;
  • Просмотр скрипта в окне Исходный код страницы ;
  • Сохранение страницы со всеми файлами на жесткий диск;
  • Ввод прямого URL в адресной строке.
  • В первом случае браузер обязательно передает http-заголовок HTTP_REFERER.
    Во втором и третьем случае он передается не всеми браузерами (Chrome, FireFox выдают ранее загруженный скрипт из кэша; Opera, IE загружают скрипт вновь, но уже без отправки referer).
    В четвертом случае referer не передается ни одним из этих четырех браузеров.
    Если выдавать JavaScript динамически с проверкой наличия заголовка referer в запросе, то мы сразу же защитимся от Opera и IE, но для Crome и Firefox придется придумать что-то позаковыристее. Мы загрузим сначала один скрипт, который в свою очередь загрузит другой скрипт, при этом обе загрузки будем проверять на наличие http-referer. Методом научного тыка установлено, что если динамически создать скрипт на странице document.createElement(«script»), а потом удалить его со страницы, то скрипт будет работать как обычно, но сохраняться он не будет.Практикаnojs.php Эта страничка несет в себе цель загрузить script1.php
    Найди JS Через 10 секунд Вы должны увидеть работу скрываемого скрипта в виде аллерта нажмите ссылку после алерта, дабы убедиться что события тоже не отвалились.
    По этой ссылке можно увидеть скрываемый скрипт script1.php Его задача: динамически загрузить script2.php, если есть заголовок referer. Таймауты можно уменьшить, в зависимости от примерного времени выполнения скрываемого скрипта.
    script2.php Его задача: выдать конечный скрипт, если есть заголовок referer
    Итоги В итоге мы получаем, что мы не можем ни посмотреть в исходном коде страницы, ни скачать, ни сохранить скрываемый скрипт средствами тестируемых четырех браузеров. Вообще же можно посмотреть его двумя способами:
    • Переход по ссылке прямо ведущей на script2.php и расположенной на странице нашего сайта;
    • Формирование http-запроса с указанием в нем заголовка referer.
    Повысыть эффективность скрытия можно такими методами:
  • С помощью mod-rewrite заменять идущие к серверу script1.js и script2.js на script1.php и script2.php соответственно, чтобы на странице были всем привычные файлы js, так как php резко бросается в глаза;
  • Сделать фиктивный скрипт максимально сложным, правдоподобным и запутанным, чтобы человек пытающийся его разобрать изрядно помучался перед осознанием того, что его обманули;
  • Обфускация кода.
  • Здравствуйте, читатель.
    В этой небольшой статье хотим расказать Вам как правильно оптимизировать категории для интернет-магазина.
    Когда мы начинаем оптимизировать текст то сначала настраиваем страницу на максимальную релевантность. Как это сделать .
    Но в данной ситуации часто возникает следующая проблема - нужно дописать слишком много текста, а это никак не вяжется с дизайном сайта.
    Поэтому нужно скрыть часть текста от пользователей , но если вдруг посетитель захочет его прочитать, то чтобы он мог его легко открыть.

    Интересное решение реализовано в интернет-гипермаркете "Розетка". Вот например категории:

    Когда мы нажимаем на данную ссылку то открывается полное описание без перезагрузки страницы. Если Вы хотите реализовать такое же решение, то ниже рассказано как это реализовывается на практике.
    Этот момент можно решить благодаря языку программирования JavaScript.
    JavaScript первоначально создавался для того, чтобы сделать web-странички «живыми».
    Чтобы установить в текст Веб-страницы скрипты JavaScript, надо ввести дескриптор . Код JavaScript располагается между тэгами . Код можно размещать как в теле заголовка страницы (между тэгами ), так и в теле страницы (между тэгами ).
    Для того работы скрипта надо создать функцию, которая будет использоваться в любой части сайта. Будем использовать функцию function sh()


    sh();
    function sh() {
    info = document.getElementById("info");
    button = document.getElementById("button");
    if (info.style.display == "none") {
    info.style.display = "block";
    button.style.display = "none";
    }
    }

    Для отображения работы скрипта на его нужно поставить в указанное место в таком виде

    Подробнее...



    ТЕКСТ КОТОРЫЙ БУДЕТ СКРЫТЫЙ

    Здесь вызывается функция function sh()
    Чтобы по умолчанию скрытый текст был открытым в коде меняем display:none на display:block

    Вот пример того что получилось после того как применили функцию к тексту:

    В этом примере на страничке было скрыто 3000 символов SEO-текста, которые были прописаны для продвижения сайта. При нажатии на ссылку сама ссылка «Подробнее…» исчезнет благодаря свойству style.display указанном в функции.
    Таким образом Вы можете реализовать данный функционал. Если у Вас остались вопросы, то задавайте их в комментариях.

    Описание: Бывают ситуации, когда не хочется выводить весь контент страницы сразу. Например, в разделе "FAQ " вывести только названия вопросов. А если человека заинтересует ответ на определённый вопрос, то он может открыть ответ, а когда просмотрит, то и закрыть. Это создаёт удобство страницы и её компактность. И для этого я подготовил простенький скрипт на JavaScript , позволяющий открыть, либо скрыть определённый текст (в общем случае, определённые элементы), то есть сделать скрытый текст на JavaScript .

    Результат: Кликните мышкой по названию вопроса. Если Вы кликните ещё раз, то ответ вновь закроется.

    Вопрос №1

    Ответ №1.

    Вопрос №2

    Ответ №2.

    Код JavaScript (вставлять между тегами и ):


    function expandit(id){
    obj = document.getElementById(id);
    if (obj.style.display=="none") obj.style.display="";
    else obj.style.display="none";
    }

    Код HTML (вставлять между тегами и ):

    Вопрос №1
    Ответ №1.
    Вопрос №2
    Ответ №2.




    Close