В тази публикация ще научите как да направите прозрачни банерите във вашия блог. Публикацията ще е кратка, но доста информативна и полезна, надявам се. Сега ще помоля всички да слязат до края на страницата, която четат и да погледнат броячите на посетители в моя блог. Както виждате, те са с различен от обичайния вид след някои промени, които направих и не са в разрез с моя дизайн. За да не отвличат вашето внимание, скъпи мои читатели, аз ги направих прозрачни. И смятам, че така те изглеждат по-ефектно, отколкото обикновено. По този начин можете да затъмните не само броячите, но и всеки банер, бутон или лого във вашия блог.
Не се съмнявам, вие също като мен сте забелязали, че в многообразието от блогове има различни броячи на посещенията, за оценки, както и различни банери. Но те имат полупрозрачен вид. Това се прави нарочно, за да не отклоняват вниманието на посетителите. Пък и кой се интересува колко посетители сме имали на блога си днес? Понякога и рекламното пространство е по-скрито от погледа. И дори някои от елементите в страничната лента.
Да се направи вида на банерите и броячите в Blogger прозрачен съвсем не е трудно. Още повече, че под курсор прозрачността на банера или брояча е 100% . Вие вече проверихте, нали?.
Да вървим нататък. За да постигнем този ефект имаме нужда от малък код и две възможности за работа с него.
Кодът е следният:
<style>#hide a img {opacity:0.5; -moz-opacity:0.5; filter:alpha(opacity=50);
}
#hide a:hover img {opacity:1.0; -moz-opacity:1.0; filter:alpha(opacity=100);
} </style>
<div id="hide"> #### </div>
◾Оцветеното в синьо е стойността, определяща видимостта на брояча или банера. В зависимост от това дали искате да го направите по-видим или по-блед, трябва да промените тези три стойности. В примера, който ви предлагам стойностите са за 50% прозрачност. Ако промените стойностите 0.5, 0.5 и 50 на по-малки, броячът ще бъде по-малко видим и обратно. В моя блог тези стойности са 0.2, 0.2 и 20.
◾Оцветеното в червено е самия код на банера или брояча.
Използвайте тази страница за редакция на вашия код и неговата проверка.
А ето и възможностите:
➤Да го добавите към притурката HTML / JavaScript
➤Имате и възможност първата част от кода на CSS да инсталирате директно в кода на темата преди реда ]]></b:skin>, но без ограждащите го тагове <style>....</style>.
А след това на необходимото място, там където ще е банерът или броячът, да се впише останалата, втората част на кода, ето тази.
<div id="hide"> #### </div>
За броячите в блога може да прочетете още, а ако банерите ви са повече от един, прочетете тук.
Експериментирайте с вашия дизайн! Успех!
Здраве за всички вас! Не забравяйте да правите добро на други хора!
Ще съм благодарна да оцените моя труд и кликнете върху звездичките по-долу. Или гласувайте за блога на:
Няма коментари:
Публикуване на коментар