Вёрстка от Колобдура

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.

Вы здесь » Вёрстка от Колобдура » Scripts » Фон для текста с любыми параметрами

Фон для текста с любыми параметрами

Страница: 1

Сообщений 1 страница 3 из 3

1

  • Автор: Kolobdur
  • Администратор
  • Kolobdur
  • Зарегистрирован: 2020-02-12
  • Приглашений: 0
  • Сообщений: 81
  • Уважение: [+0/-0]
  • Позитив: [+0/-0]
  • Пол: Мужской
  • Возраст: 43 [1980-10-04]
  • Провел на форуме:
    2 дня 16 часов
  • Последний визит:
    2024-01-14 19:25:38

Фон для текста с любыми параметрами:

Код:
<!--Фон для текста с любыми параметрами-->
<script type="text/javascript">
$('td#button-font').after('<td id="backgr" style=\'background-image:url("http://s4.uploads.ru/zkAou.png")\' title="Фон для текста" onclick="tag_background()"></td>');
$(function(){
$('.post-content:contains("[background=")').each(function(){
var htmlbackground = $(this).html().replace(/\[background=(.*?)\]([^`]*?)\[\/background\]/gi, "<span style='width=80%; background:$1;'>$2</span>");
$(this).html(htmlbackground)
});
});
function tag_background(){
var FoundErrorsBACKGROUND = '';
var backgroundTIT = prompt('Введите параметры фона', 'url("http://s4.uploads.ru/zkAou.png") no-repeat #fc0');
if (FoundErrorsBACKGROUND)
{alert("Ошибка!" + FoundErrorsBACKGROUND);
return;}
bbcode('[background='+backgroundTIT+']','[/background]');
}
</script>

Примеры:
http://s1.uploads.ru/gJkDs.png

Код:
[background=url("http://images.gofreedownload.net/heart-handprint-seamless-pattern-239222.jpg") no-repeat #fc0]буууууууууууууууууууууууууууууууу[/background]


[background=url("http://s4.uploads.ru/zkAou.png") no-repeat #fc0]Очень много текста!!! Примеры!!![/background]


[background=#F8F8FF][b][size=20]И еще огромное количество текста!!![/size][/b][/background]

[background=#F8F8FF][b][size=20][shadow=1px 1px 2px #FFF6AD]И еще огромное количество текста но с тенью!!![/shadow][/size][/b][/background]

Ссылки на картинки ставить обязательно в кавычки: "здесь ссылка", то есть вот так:

background=url("http://s4.uploads.ru/zkAou.png") no-repeat #fc0

Если картинка не нужна, то можно поставить только цвет таким образом:

background=#F8F8FF

0

2

  • Автор: Kolobdur
  • Администратор
  • Kolobdur
  • Зарегистрирован: 2020-02-12
  • Приглашений: 0
  • Сообщений: 81
  • Уважение: [+0/-0]
  • Позитив: [+0/-0]
  • Пол: Мужской
  • Возраст: 43 [1980-10-04]
  • Провел на форуме:
    2 дня 16 часов
  • Последний визит:
    2024-01-14 19:25:38

С регулированием ширины и высоты:

Код:
<!--Фон для текста с любыми параметрами с регулированием ширины и высоты-->
<script type="text/javascript">
$('td#button-font').after('<td id="backgr" style=\'background-image:url("http://s4.uploads.ru/zkAou.png")\' title="Фон для текста" onclick="tag_background()"></td>');
$(function(){
$('.post-content:contains("[background=")').each(function(){
var htmlbackground = $(this).html().replace(/\[background=(.*?)\,(.*?)\,(.*?)\]([^`]*?)\[\/background\]/gi, "<div style='background:$1;width:$2;height:$3;'>$4</div>");
$(this).html(htmlbackground)
});
});
function tag_background(){
var FoundErrorsBACKGROUND = '';
var backgroundTIT = prompt('Введите параметры фона', 'url("http://s4.uploads.ru/zkAou.png") no-repeat #fc0');
var backgroundTIT2 = prompt('Введите ширину', '80%');
var backgroundTIT3 = prompt('Введите Высоту', '200px');
if (FoundErrorsBACKGROUND)
{alert("Ошибка!" + FoundErrorsBACKGROUND);
return;}
bbcode('[background='+backgroundTIT+','+backgroundTIT2+','+backgroundTIT3+']','[/background]');
}
</script>

Вставлять через запятую:
1. Параметры фона (картинку, повторяется или нет, позицию, цвет)
2. Требуемую ширину
3. Требуемую высоту

Ширину и высоту можно ставить как пикселях так и в процентах, но высоту стоит ставить в пикселях, иначе сожмется до текста..

0

3

  • Автор: Kolobdur
  • Администратор
  • Kolobdur
  • Зарегистрирован: 2020-02-12
  • Приглашений: 0
  • Сообщений: 81
  • Уважение: [+0/-0]
  • Позитив: [+0/-0]
  • Пол: Мужской
  • Возраст: 43 [1980-10-04]
  • Провел на форуме:
    2 дня 16 часов
  • Последний визит:
    2024-01-14 19:25:38

С регулированием положения текста (отступы сверху и слева):

Код:
<!--Фон для текста с любыми параметрами с регулированием ширины и высоты и положением текста-->
<script type="text/javascript">
$('td#button-font').after('<td id="backgr" style=\'background-image:url("http://s4.uploads.ru/zkAou.png")\' title="Фон для текста" onclick="tag_background()"></td>');
$(function(){
$('.post-content:contains("[background=")').each(function(){
var htmlbackground = $(this).html().replace(/\[background=(.*?)\,(.*?)\,(.*?)\,(.*?)\,(.*?)\]([^`]*?)\[\/background\]/gi, "<div style='position:relative;background:$1;width:$2;height:$3;'><span style='position:absolute;top:$4;left:$5;'>$6</span></div>");
$(this).html(htmlbackground)
});
});
function tag_background(){
var FoundErrorsBACKGROUND = '';
var backgroundTIT = prompt('Введите параметры фона', 'url("http://s4.uploads.ru/zkAou.png") no-repeat #fc0');
var backgroundTIT2 = prompt('Введите ширину', '80%');
var backgroundTIT3 = prompt('Введите Высоту', '200px');
var backgroundTIT4 = prompt('Введите Отступ сверху', '50%');
var backgroundTIT5 = prompt('Введите Отступ слева', '10%');
if (FoundErrorsBACKGROUND)
{alert("Ошибка!" + FoundErrorsBACKGROUND);
return;}
bbcode('[background='+backgroundTIT+','+backgroundTIT2+','+backgroundTIT3+','+backgroundTIT4+','+backgroundTIT5+']','[/background]');
}
</script>

Здесь вставлять через запятую 5 параметров:
1. Параметры фона (картинку, повторяется или нет, позицию, цвет)
2. Требуемую ширину
3. Требуемую высоту
4: Отступ сверху
5: Отступ слева

Отступы можно ставить как в процентах так и в пикселях..

0

Страница: 1

Похожие темы

Каталог Scipts Scripts 2021-10-03

Вы здесь » Вёрстка от Колобдура » Scripts » Фон для текста с любыми параметрами