Продолжая Новогоднюю тему, которую подняла в этом посте, предлагаю ещё идеи для украшения блога к празднику. Начну опять с самых простых вариантов. Возможно, многие определились уже с тем, как оформить блог к Новому году. Надеюсь, что лишней сегодняшняя шпаргалка не будет.
То, о чем пойдёт речь ниже, может пригодиться и для других случаев.
1. Переливающийся текст. Очень симпатично может смотреться такая строка как в самом теле сообщения, так и где-нибудь под шапкой блога.
КодТо, о чем пойдёт речь ниже, может пригодиться и для других случаев.
1. Переливающийся текст. Очень симпатично может смотреться такая строка как в самом теле сообщения, так и где-нибудь под шапкой блога.
<center>
<script language="JavaScript1.2">
var message="С наступающим Новым годом!!!"
var neonbasecolor="#990000"
var neontextcolor="#f72c16"
var neontextcolor2="#f4fc5d"
var flashspeed=120
var flashingletters=3
var flashingletters2=1
var flashpause=0
var n=0
if (document.all||document.getElementById){
document.write('<font color="'+neonbasecolor+'" size=+1>')
for (m=0;m<message.length;m++)
document.write('<span id="neonlight'+m+'">'+message.charAt(m)+'</span>')
document.write('</font>')
}
else
document.write(message)
function crossref(number){
var crossobj=document.all? eval("document.all.neonlight"+number) : document.getElementById("neonlight"+number)
return crossobj
}
function neon(){
//Change all letters to base color
if (n==0){
for (m=0;m<message.length;m++)
crossref(m).style.color=neonbasecolor
}
crossref(n).style.color=neontextcolor
if (n>flashingletters-1) crossref(n-flashingletters).style.color=neontextcolor2
if (n>(flashingletters+flashingletters2)-1) crossref(n-flashingletters-flashingletters2).style.color=neonbasecolor
if (n<message.length-1) n++
else{
n=0
clearInterval(flashing)
setTimeout("beginneon()",flashpause)
return
}
}
function beginneon(){
if (document.all||document.getElementById)
flashing=setInterval("neon()",flashspeed)
}
beginneon()
</script></center>
<script language="JavaScript1.2">
var message="С наступающим Новым годом!!!"
var neonbasecolor="#990000"
var neontextcolor="#f72c16"
var neontextcolor2="#f4fc5d"
var flashspeed=120
var flashingletters=3
var flashingletters2=1
var flashpause=0
var n=0
if (document.all||document.getElementById){
document.write('<font color="'+neonbasecolor+'" size=+1>')
for (m=0;m<message.length;m++)
document.write('<span id="neonlight'+m+'">'+message.charAt(m)+'</span>')
document.write('</font>')
}
else
document.write(message)
function crossref(number){
var crossobj=document.all? eval("document.all.neonlight"+number) : document.getElementById("neonlight"+number)
return crossobj
}
function neon(){
//Change all letters to base color
if (n==0){
for (m=0;m<message.length;m++)
crossref(m).style.color=neonbasecolor
}
crossref(n).style.color=neontextcolor
if (n>flashingletters-1) crossref(n-flashingletters).style.color=neontextcolor2
if (n>(flashingletters+flashingletters2)-1) crossref(n-flashingletters-flashingletters2).style.color=neonbasecolor
if (n<message.length-1) n++
else{
n=0
clearInterval(flashing)
setTimeout("beginneon()",flashpause)
return
}
}
function beginneon(){
if (document.all||document.getElementById)
flashing=setInterval("neon()",flashspeed)
}
beginneon()
</script></center>
Установка. Скопируйте код в блокнот или черновик блога. Все цветовые значения, которые выделены синим цветом можете поменять на свои. Также и приветствие. В редакторе сообщений перейдите из режима создать в режим HTML вставляйте готовый код. При переходе обратно буковки на будут видны. Нажмите на функцию просмотра и увидите результат. Таким образом приветствие будет в теле сообщения. Если код установить в гаджет и переместить его выше сообщений блога, приветствие отобразится на всех страницах.
2. Бегущая картинка с приветствием и пожеланиями.
Код
<marquee><img title="Дед Мороз" src=" http://3rebenka.ru/wp-content/uploads/nygif/49.gif"/>С Новым Годом</marquee>
Код устанавливается вышеописанным способом. Заранее подберите картинку. И в строку, которую я выделила синим, вставьте её адрес(URL). В моём случае это GIF-анимация. С помощью свойства <marquee> её и заставили двигаться. "Мы поедем, мы помчимся..."
Чтобы само приветствие не казалось таким скучным зададим параметры тексту. Вот так
<span style="color: #4abf32; font-family: Verdana, sans-serif; font-size: large;
Код будет немного другим.
<marquee><img src=" адрес вашей картинки" title="дед мороз" /><span style="color: #4abf32; font-family: Verdana, sans-serif; font-size: large;">С Новым годом</span></marquee>
Смотрим результат.
3. Красивая Новогодняя картинка в углу блога.
Сразу предлагаю посмотреть на скриншот, чтобы было понятно о чём идёт речь.
Для реализации скопируйте следующий код.
<img src=" адрес вашей картинки" style="position:fixed; top: 0px;left:0px;border:none;z-index:5;"/>
Картинку лучше брать в формате PND, GIF. Желательно небольшого размера. готовый код вставляем в гаджет HTML/JavaScript. Только запомните, где этот гаджет находится, чтобы после праздника его удалить. При желании можно расположить картинку справа, заменив значение на left на right.
На тот случай, если очень хочется видеть украшение и слева и справа, сделаем следующее. Загружаем выбранную картинку в любой редактор изображений, тот же Point и воспользуемся функцией повернуть.
Сохраните файл на компьютере. Теперь у нас та же картинка, только в зеркальном отображении. И код для установки двух картинок будет такой
<img src="адрес левой картинки" style="position:fixed; top: 0px;left:0px;border:none;z-index:5;"/><img src="адрес правой картинки" style="position:fixed; top: 0px;right:0px;border:none;z-index:5;"/>.
Вообще, сохраните где-нибудь у себя эти коды. Подобным образом можно украсить страницу к любому празднику.
Сегодня на этом закончу. Надеюсь, что вы для себя подберёте подходящий вариант. А в теме Новогодних украшений блога точку пока не поставлю. Как говорится-дальше будет интересней. Следите за обновлениями блога.
Удачи нам всем.
оформите подписку на новые шпаргалки
Здравствуйте, Вика! Мне очень понравился Ваш блог! В нем столько полезной и нужной информации! К сожалению, я большой "чайник" с таких вопросах. Может Вы согласитесь стать моим персональным учителем? Я создала свой блог благодаря школе про100. Теперь, закончив школу, теряюсь во всех этих гаджетах без посторонней помощи. Я могу Вам заплатить за помощь, или могу помочь с фотошопом - неплохо работаю в этой программе.
ОтветитьУдалитьС уважением, Татьяна.
Татьяна, спасибо на добром слове. А насчёт помощи-конечно помогу, чем могу, что знаю. Обращайтесь или через комментарии, или через форму связи ниже.
УдалитьВика, спасибо! Благодаря тебе у себя красоту завела)))
ОтветитьУдалитьИрина, я побежала смотреть.
Удалить