Помощник
|
Простая подстветка кода на вашем сайте, Моё решение |
z17
|
Сообщение
#1
|
||
|
|
||
|
|||
Gerga |
9.9.2015, 2:54;
Ответить: Gerga
Сообщение
#2
|
|
Еще проще:
Развернуть/Свернуть
js: Код jQuery.noConflict(); (function($) { $(function() { if( $('pre').length > 0 ) { // Получаем pre var $pre = $('pre'); // Перебираем полученные pre $pre.each(function(){ var $this = $(this) var result = ''; var s = $this.text(); // разбиваем на массив по переносу var arr = s.split('\n'); // выполняем действия над каждым элементом массива arr.forEach(function(entry){ if ( entry != '' ) result = result + '<li><XMP style="margin:0; height: 15px">' + entry + '</XMP></li>'; }) $this.html('<ul class="new_pre">'+result+'</ul>'); }) } }) })(jQuery) css: Код * {margin: 0; padding: 0} pre { max-height: 200px; overflow: auto } ul.new_pre { counter-reset: num; margin: 10px 0; } ul.new_pre li { padding: 0 0 0 57px; position: relative; list-style-type: none } ul.new_pre li:after { content: counter(num); counter-increment: num; position: absolute; z-index: 99; top: 0; right: auto; bottom: 0; left: 0; display: block; width: 30px; height: 100%; padding: 0 7px 0 2px; border-right: 3px solid #6ce26c !important; text-align: right; color: #AFAFAF; } html: Код <pre> function hello() { return "Hello!"; } </pre> итого: Код <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>Заголовок</title> <link href="style.css" rel="stylesheet" /> <!--[if lt IE 9]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]--> </head> <body class="wrapper"> <pre> function hello() { return "Hello!"; } </pre> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> <script src="script.js"></script> </body> </html> |
|
|
z17
|
Сообщение
#3
|
|
Gerga, это не совсем то.
Ваше решение просто добавляет нумерацию строк, а не подсветку синтаксиса. -------------------- |
|
|
asAlbert |
9.9.2015, 7:44;
Ответить: asAlbert
Сообщение
#4
|
|
А где можно увидеть, как будет подсвечиваться?
|
|
|
Gerga |
9.9.2015, 11:51;
Ответить: Gerga
Сообщение
#5
|
|
asAlbert, мое решение тут http://jsfiddle.net/xvondvt5/ можете наблюдать, поле "Result".
Сообщение отредактировал Gerga - 9.9.2015, 11:51 |
|
|
z17
|
Сообщение
#6
|
|
|
asAlbert, в репозитории, если его выкачать, есть файл index.html с примером.
Либо можно посмотреть, к примеру, эту статью в моём блоге, где встречается код.
-------------------- |
|
|
||
|
Похожие темы
Тема | Ответов | Автор | Просмотров | Последний ответ | |
---|---|---|---|---|---|
CryptoCloud — прием USDT, BTC, ETH, LTC на любом сайте | 34 | CryptoCLoud | 10071 | 18.3.2024, 16:56 автор: CryptoCLoud |
|
Странный трафик на сайте длительное время | 26 | TABAK | 7520 | 16.3.2024, 17:31 автор: Boymaster |
|
Быстрый и качественный обмен на сайте Baksman.org Обмен Bitcoin, BTC-e, PM, Qiwi, Yandex money, Карты банк |
51 | Baksman | 33208 | 15.3.2024, 21:14 автор: Baksman |
|
Алтуально ли заработок на сайте? Оцение пожалуйста идею |
10 | hitman20 | 1780 | 1.2.2024, 5:37 автор: Liudmila |
|
Готовые комплекты для создания узконишевых сайтов | (Готовые статьи, семантическое ядро) | Опубликуйте статьи на сайте и получите трафик из ПС без затрат на продвижение | 8 | rainbowinthedark | 2818 | 14.7.2023, 16:08 автор: rainbowinthedark |
Текстовая версия | Сейчас: 29.3.2024, 2:10 |