Здравствуйте, гость ( Вход | Регистрация )

 
Ответить в эту темуОткрыть новую тему
> Пожелание для блока кода, [code] ... [/code]
Fors1k
сообщение 11.12.2019, 2:51
Сообщение #1


*****

Journeyman
Сообщений: 497
Регистрация: 19.12.2017
Группа: Пользователи
Наличность: 2420
Пользователь №: 18.746



Здравствуйте. Если возможно, прошу добавить опцию нумерации строк кода, при обрамлении его в блок,
как, например, это выглядит здесь.


--------------------
Для связиИзображение
Пользователь в офлайнеDelete PostОтправить личное сообщение
Вернуться в начало страницы
+Ответить с цитированием данного сообщения
FREEON
сообщение 18.6.2020, 2:10
Сообщение #2


*****

Journeyman
Сообщений: 365
Регистрация: 14.2.2017
Группа: Пользователи
Наличность: 1319
Пользователь №: 18.346
Возраст: 25



примерно так...только js нужно править там дофига лишних языков но при желании можно довести да ума подсветку для пилота и lua
Прикрепленный файл  htmlUoPilotCcode.zip ( 48,75 килобайт ) Кол-во скачиваний: 429
Пользователь в офлайнеDelete PostОтправить личное сообщение
Вернуться в начало страницы
+Ответить с цитированием данного сообщения
FREEON
сообщение 18.6.2020, 10:38
Сообщение #3


*****

Journeyman
Сообщений: 365
Регистрация: 14.2.2017
Группа: Пользователи
Наличность: 1319
Пользователь №: 18.346
Возраст: 25



Вот более простой вариант без подсветки кода.
Подключаем к html css
CSS
Код
.operative { font-weight: bold; border: 1px solid yellow; }
#quine { border: 4px solid #D3C694; }
body {
  background-color:#FAFCFE;
  padding:50px 50px;
}

pre {
  background-color:#F2E9C0;
  overflow:auto;
  margin:0 0 1em;
  padding:.5em 1em;
}

pre code, pre .line-number {
  font:normal normal 12px/14px "Courier New",Courier,Monospace;
  color:black;
  display:block;
}

pre .line-number {
  float:left;
  margin:0 1em 0 -1em;
  border-right:1px solid;
  text-align:right;
}

pre .line-number span {
  display:block;
  padding:0 .5em 0 1em;
}

pre .cl {
  display:block;
  clear:both;
}

И затем Javascript должен идти после закрывающегося тега </pre> (например в самом низу html)
JS
Код
(function() {
    var pre = document.getElementsByTagName('pre'),
        pl = pre.length;
    for (var i = 0; i < pl; i++) {
        pre[i].innerHTML = '<span class="line-number"></span>' + pre[i].innerHTML + '<span class="cl"></span>';
        var num = pre[i].innerHTML.split(/\n/).length;
        for (var j = 0; j < num; j++) {
            var line_num = pre[i].getElementsByTagName('span')[0];
            line_num.innerHTML += '<span>' + (j + 1) + '</span>';
        }
        line_num.innerHTML += '<span>' + (j + 1) + '</span>';
    }
})();
Прикрепленный файл  index.zip ( 1,79 килобайт ) Кол-во скачиваний: 376

отключить выделение цифр в css дописываем(заменяем pre .line-number span на этот код) следующие строчки
Код
pre .line-number span {
  display:block;
  padding:0 .5em 0 1em;
  /**
             * Для эксплорера
             */
            -ms-user-select: none;

            /**
             * Для мозилы
             */
            -moz-user-select: none;

            /**
             * Для конкверора
             */
            -khtml-user-select: none;

            /**
             * Для Сафари и Хрома
             */
            -webkit-user-select: none;
}


Сообщение отредактировал FREEON - 18.6.2020, 11:50
Пользователь в офлайнеDelete PostОтправить личное сообщение
Вернуться в начало страницы
+Ответить с цитированием данного сообщения
FREEON
сообщение 18.6.2020, 17:40
Сообщение #4


*****

Journeyman
Сообщений: 365
Регистрация: 14.2.2017
Группа: Пользователи
Наличность: 1319
Пользователь №: 18.346
Возраст: 25



Простой2. С кнопкой Копировать код из блока кода.
Прикрепленный файл  PreCopy.zip ( 7,76 килобайт ) Кол-во скачиваний: 388
Пользователь в офлайнеDelete PostОтправить личное сообщение
Вернуться в начало страницы
+Ответить с цитированием данного сообщения

Ответить в эту темуОткрыть новую тему
2 чел. читают эту тему (гостей: 2, скрытых пользователей: 0)
Пользователей: 0

 

- Текстовая версия | Версия для КПК Сейчас: 29.3.2024, 2:04
Designed by Nickostyle