sábado, 2 de outubro de 2010
Janela Flutuante
Olá hoje eu vou ensinar a colocar uma janela flutuante no blog, é uma janela que você pode colocar imagens, vídeos, anúncios, mensagem, até mesmo destaque da semana, como eu ja fiz uma vez aqui, bom é só usar a criatividade, essa janela, flutua pela página e o visitante pode fechar ela se quiser, e é muito facil de colocar!
Eu fiz 2 modelos prontos, e 1 para modificar de acordo com as cores do seu blog.
Escolha um e pegue o códico na caixinha:
Escolha um e pegue o códico na caixinha:
<!--Começo do script Karen Star ---><style type="text/css">
#topbar{
position:absolute;
border: 2px dashed #ffc9fb;
padding: 10px;
margin: 2% 0 0 55%;
color:#ffc9fb;
background:url(http://karenstar.dominiotemporario.com/valentineback30.gif);
width: 37%;
visibility: hidden;
z-index: 600;
}</style>
<div style="visibility: visible; top: 139px; left: 20px" id="topbar" sp="function(x,y){this.style.left=x+"px";this.style.top=y+"px";}" x="20" y="139.004008097081"><a onclick="closebar(); return false" href=""><img border="0" src="http://karenstar.dominiotemporario.com/th_xiss.gif" /></a><span style="font-size: 12px"><b>Aqui coloque o que quiser. Imagens, mensagens,alertas...Até mesmo umm destaque da semana!... </b></span></div>
<script type="text/javascript">
var persistclose=0 //
var startX = 20 //
var startY = 5 //
var verticalpos="fromtop" //
function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) {
offset += search.length
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}
function closebar(){
if (persistclose)
document.cookie="remainclosed=1"
document.getElementById("topbar").style.visibility="hidden"
}
function staticbar(){
barheight=document.getElementById("topbar").offsetHeight
var ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera;
var d = document;
function ml(id){
var el=d.getElementById(id);
if (!persistclose || persistclose && get_cookie("remainclosed")=="")
el.style.visibility="visible"
if(d.layers)el.style=el;
el.sP=function(x,y){this.style.left=x+"px";this.style.top=y+"px";};
el.x = startX;
if (verticalpos=="fromtop")
el.y = startY;
else{
el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;
el.y -= startY;
}
return el;
}
window.stayTopLeft=function(){
if (verticalpos=="fromtop"){
var pY = ns ? pageYOffset : iecompattest().scrollTop;
ftlObj.y += (pY + startY - ftlObj.y)/8;
}
else{
var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight;
ftlObj.y += (pY - startY - ftlObj.y)/8;
}
ftlObj.sP(ftlObj.x, ftlObj.y);
setTimeout("stayTopLeft()", 10);
}
ftlObj = ml("topbar");
stayTopLeft();
}
if (window.addEventListener)
window.addEventListener("load", staticbar, false)
else if (window.attachEvent)
window.attachEvent("onload", staticbar)
else if (document.getElementById)
window.onload=staticbar
</script><!--Fim do script Karen Star --->
<!--Começo do script Karen Star --->
<style type="text/css">
#topbar{
position:absolute;
border: 2px dashed #66c3e9;
padding: 10px;
margin: 2% 0 0 55%;
color:#66c3e9;
background:url(http://karenstar.dominiotemporario.com/b2c.jpg);
width: 37%;
visibility: hidden;
z-index: 600;
}
</style>
<div id='topbar'>
<a href='' onclick='closebar(); return false'><img border="0" src="http://karenstar.dominiotemporario.com/th_xiss.gif" /></a><span style="font-size: 12px;"><b>Aqui coloque o que quiser. Imagens, mensagens,alertas...Até mesmo umm destaque da semana!...
</b></span>
</div>
<script type="text/javascript">
var persistclose=0 //
var startX = 20 //
var startY = 5 //
var verticalpos="fromtop" //
function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) {
offset += search.length
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}
function closebar(){
if (persistclose)
document.cookie="remainclosed=1"
document.getElementById("topbar").style.visibility="hidden"
}
function staticbar(){
barheight=document.getElementById("topbar").offsetHeight
var ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera;
var d = document;
function ml(id){
var el=d.getElementById(id);
if (!persistclose || persistclose && get_cookie("remainclosed")=="")
el.style.visibility="visible"
if(d.layers)el.style=el;
el.sP=function(x,y){this.style.left=x+"px";this.style.top=y+"px";};
el.x = startX;
if (verticalpos=="fromtop")
el.y = startY;
else{
el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;
el.y -= startY;
}
return el;
}
window.stayTopLeft=function(){
if (verticalpos=="fromtop"){
var pY = ns ? pageYOffset : iecompattest().scrollTop;
ftlObj.y += (pY + startY - ftlObj.y)/8;
}
else{
var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight;
ftlObj.y += (pY - startY - ftlObj.y)/8;
}
ftlObj.sP(ftlObj.x, ftlObj.y);
setTimeout("stayTopLeft()", 10);
}
ftlObj = ml("topbar");
stayTopLeft();
}
if (window.addEventListener)
window.addEventListener("load", staticbar, false)
else if (window.attachEvent)
window.attachEvent("onload", staticbar)
else if (document.getElementById)
window.onload=staticbar
</script>
<!--Fim do script Karen Star --->
Depois de pegar o códico da janela escolhida, vá em:
"Design - Elementos de página"
Click em:
" Adicionar um Gadget - HTML/JavaScript
E cole o códico! E prontinho!
Agora se nenhuma dessas caixinhas combina com o seu blog, pegue este códico abaixo e nele ta explicando onde colocar um fundo, mudar a cor da fonte, colocar outro "x" (para fechar)...
E se não você não tem conhecimento, não mexa mais em nada além de onde esta indicando que pode modificar, para não dá nada errado.
E se não você não tem conhecimento, não mexa mais em nada além de onde esta indicando que pode modificar, para não dá nada errado.
<!--Começo do script Karen Star --->
<style type="text/css">
#topbar{
position:absolute;
border: 2px dashed #000;/*AQUI VOCÊ COLOCA A COR DA BORDA*/
padding: 10px;
margin: 2% 0 0 55%;
color:#000;/*AQUI VOCÊ COLOCA A COR DA FONTE*/
background:url(AQUI VOCÊ COLOCA O ENDEREÇO DO FUNDO QUE VOCÊ QUER);/*ENDEREÇO DO BACKGROUND*/
width: 37%;
visibility: hidden;
z-index: 600;
}
</style>
<div id='topbar'>
<a href='' onclick='closebar(); return false'><img border="0" src="http://karenstar.dominiotemporario.com/th_xiss.gif" /></a><span style="font-size: 12px;"><b>Aqui coloque o que quiser. Imagens, mensagens,alertas...Até mesmo umm destaque da semana!...
</b></span>
</div>
<script type="text/javascript">
var persistclose=0 //
var startX = 20 //
var startY = 5 //
var verticalpos="fromtop" //
function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) {
offset += search.length
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}
function closebar(){
if (persistclose)
document.cookie="remainclosed=1"
document.getElementById("topbar").style.visibility="hidden"
}
function staticbar(){
barheight=document.getElementById("topbar").offsetHeight
var ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera;
var d = document;
function ml(id){
var el=d.getElementById(id);
if (!persistclose || persistclose && get_cookie("remainclosed")=="")
el.style.visibility="visible"
if(d.layers)el.style=el;
el.sP=function(x,y){this.style.left=x+"px";this.style.top=y+"px";};
el.x = startX;
if (verticalpos=="fromtop")
el.y = startY;
else{
el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;
el.y -= startY;
}
return el;
}
window.stayTopLeft=function(){
if (verticalpos=="fromtop"){
var pY = ns ? pageYOffset : iecompattest().scrollTop;
ftlObj.y += (pY + startY - ftlObj.y)/8;
}
else{
var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight;
ftlObj.y += (pY - startY - ftlObj.y)/8;
}
ftlObj.sP(ftlObj.x, ftlObj.y);
setTimeout("stayTopLeft()", 10);
}
ftlObj = ml("topbar");
stayTopLeft();
}
if (window.addEventListener)
window.addEventListener("load", staticbar, false)
else if (window.attachEvent)
window.attachEvent("onload", staticbar)
else if (document.getElementById)
window.onload=staticbar
</script>
<!--Fim do script Karen Star --->
Janela Flutuante
Olá hoje eu vou ensinar a colocar uma janela flutuante no blog, é uma janela que você pode colocar imagens, vídeos, anúncios, mensagem, até mesmo destaque da semana, como eu ja fiz uma vez aqui, bom é só usar a criatividade, essa janela, flutua pela página e o visitante pode fechar ela se quiser, e é muito facil de colocar!
Eu fiz 2 modelos prontos, e 1 para modificar de acordo com as cores do seu blog.
Escolha um e pegue o códico na caixinha:
Escolha um e pegue o códico na caixinha:
<!--Começo do script Karen Star ---><style type="text/css">
#topbar{
position:absolute;
border: 2px dashed #ffc9fb;
padding: 10px;
margin: 2% 0 0 55%;
color:#ffc9fb;
background:url(http://karenstar.dominiotemporario.com/valentineback30.gif);
width: 37%;
visibility: hidden;
z-index: 600;
}</style>
<div style="visibility: visible; top: 139px; left: 20px" id="topbar" sp="function(x,y){this.style.left=x+"px";this.style.top=y+"px";}" x="20" y="139.004008097081"><a onclick="closebar(); return false" href=""><img border="0" src="http://karenstar.dominiotemporario.com/th_xiss.gif" /></a><span style="font-size: 12px"><b>Aqui coloque o que quiser. Imagens, mensagens,alertas...Até mesmo umm destaque da semana!... </b></span></div>
<script type="text/javascript">
var persistclose=0 //
var startX = 20 //
var startY = 5 //
var verticalpos="fromtop" //
function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) {
offset += search.length
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}
function closebar(){
if (persistclose)
document.cookie="remainclosed=1"
document.getElementById("topbar").style.visibility="hidden"
}
function staticbar(){
barheight=document.getElementById("topbar").offsetHeight
var ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera;
var d = document;
function ml(id){
var el=d.getElementById(id);
if (!persistclose || persistclose && get_cookie("remainclosed")=="")
el.style.visibility="visible"
if(d.layers)el.style=el;
el.sP=function(x,y){this.style.left=x+"px";this.style.top=y+"px";};
el.x = startX;
if (verticalpos=="fromtop")
el.y = startY;
else{
el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;
el.y -= startY;
}
return el;
}
window.stayTopLeft=function(){
if (verticalpos=="fromtop"){
var pY = ns ? pageYOffset : iecompattest().scrollTop;
ftlObj.y += (pY + startY - ftlObj.y)/8;
}
else{
var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight;
ftlObj.y += (pY - startY - ftlObj.y)/8;
}
ftlObj.sP(ftlObj.x, ftlObj.y);
setTimeout("stayTopLeft()", 10);
}
ftlObj = ml("topbar");
stayTopLeft();
}
if (window.addEventListener)
window.addEventListener("load", staticbar, false)
else if (window.attachEvent)
window.attachEvent("onload", staticbar)
else if (document.getElementById)
window.onload=staticbar
</script><!--Fim do script Karen Star --->
<!--Começo do script Karen Star --->
<style type="text/css">
#topbar{
position:absolute;
border: 2px dashed #66c3e9;
padding: 10px;
margin: 2% 0 0 55%;
color:#66c3e9;
background:url(http://karenstar.dominiotemporario.com/b2c.jpg);
width: 37%;
visibility: hidden;
z-index: 600;
}
</style>
<div id='topbar'>
<a href='' onclick='closebar(); return false'><img border="0" src="http://karenstar.dominiotemporario.com/th_xiss.gif" /></a><span style="font-size: 12px;"><b>Aqui coloque o que quiser. Imagens, mensagens,alertas...Até mesmo umm destaque da semana!...
</b></span>
</div>
<script type="text/javascript">
var persistclose=0 //
var startX = 20 //
var startY = 5 //
var verticalpos="fromtop" //
function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) {
offset += search.length
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}
function closebar(){
if (persistclose)
document.cookie="remainclosed=1"
document.getElementById("topbar").style.visibility="hidden"
}
function staticbar(){
barheight=document.getElementById("topbar").offsetHeight
var ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera;
var d = document;
function ml(id){
var el=d.getElementById(id);
if (!persistclose || persistclose && get_cookie("remainclosed")=="")
el.style.visibility="visible"
if(d.layers)el.style=el;
el.sP=function(x,y){this.style.left=x+"px";this.style.top=y+"px";};
el.x = startX;
if (verticalpos=="fromtop")
el.y = startY;
else{
el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;
el.y -= startY;
}
return el;
}
window.stayTopLeft=function(){
if (verticalpos=="fromtop"){
var pY = ns ? pageYOffset : iecompattest().scrollTop;
ftlObj.y += (pY + startY - ftlObj.y)/8;
}
else{
var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight;
ftlObj.y += (pY - startY - ftlObj.y)/8;
}
ftlObj.sP(ftlObj.x, ftlObj.y);
setTimeout("stayTopLeft()", 10);
}
ftlObj = ml("topbar");
stayTopLeft();
}
if (window.addEventListener)
window.addEventListener("load", staticbar, false)
else if (window.attachEvent)
window.attachEvent("onload", staticbar)
else if (document.getElementById)
window.onload=staticbar
</script>
<!--Fim do script Karen Star --->
Depois de pegar o códico da janela escolhida, vá em:
"Design - Elementos de página"
Click em:
" Adicionar um Gadget - HTML/JavaScript
E cole o códico! E prontinho!
Agora se nenhuma dessas caixinhas combina com o seu blog, pegue este códico abaixo e nele ta explicando onde colocar um fundo, mudar a cor da fonte, colocar outro "x" (para fechar)...
E se não você não tem conhecimento, não mexa mais em nada além de onde esta indicando que pode modificar, para não dá nada errado.
E se não você não tem conhecimento, não mexa mais em nada além de onde esta indicando que pode modificar, para não dá nada errado.
<!--Começo do script Karen Star --->
<style type="text/css">
#topbar{
position:absolute;
border: 2px dashed #000;/*AQUI VOCÊ COLOCA A COR DA BORDA*/
padding: 10px;
margin: 2% 0 0 55%;
color:#000;/*AQUI VOCÊ COLOCA A COR DA FONTE*/
background:url(AQUI VOCÊ COLOCA O ENDEREÇO DO FUNDO QUE VOCÊ QUER);/*ENDEREÇO DO BACKGROUND*/
width: 37%;
visibility: hidden;
z-index: 600;
}
</style>
<div id='topbar'>
<a href='' onclick='closebar(); return false'><img border="0" src="http://karenstar.dominiotemporario.com/th_xiss.gif" /></a><span style="font-size: 12px;"><b>Aqui coloque o que quiser. Imagens, mensagens,alertas...Até mesmo umm destaque da semana!...
</b></span>
</div>
<script type="text/javascript">
var persistclose=0 //
var startX = 20 //
var startY = 5 //
var verticalpos="fromtop" //
function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) {
offset += search.length
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}
function closebar(){
if (persistclose)
document.cookie="remainclosed=1"
document.getElementById("topbar").style.visibility="hidden"
}
function staticbar(){
barheight=document.getElementById("topbar").offsetHeight
var ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera;
var d = document;
function ml(id){
var el=d.getElementById(id);
if (!persistclose || persistclose && get_cookie("remainclosed")=="")
el.style.visibility="visible"
if(d.layers)el.style=el;
el.sP=function(x,y){this.style.left=x+"px";this.style.top=y+"px";};
el.x = startX;
if (verticalpos=="fromtop")
el.y = startY;
else{
el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;
el.y -= startY;
}
return el;
}
window.stayTopLeft=function(){
if (verticalpos=="fromtop"){
var pY = ns ? pageYOffset : iecompattest().scrollTop;
ftlObj.y += (pY + startY - ftlObj.y)/8;
}
else{
var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight;
ftlObj.y += (pY - startY - ftlObj.y)/8;
}
ftlObj.sP(ftlObj.x, ftlObj.y);
setTimeout("stayTopLeft()", 10);
}
ftlObj = ml("topbar");
stayTopLeft();
}
if (window.addEventListener)
window.addEventListener("load", staticbar, false)
else if (window.attachEvent)
window.attachEvent("onload", staticbar)
else if (document.getElementById)
window.onload=staticbar
</script>
<!--Fim do script Karen Star --->
Janela Flutuante
Olá hoje eu vou ensinar a colocar uma janela flutuante no blog, é uma janela que você pode colocar imagens, vídeos, anúncios, mensagem, até mesmo destaque da semana, como eu ja fiz uma vez aqui, bom é só usar a criatividade, essa janela, flutua pela página e o visitante pode fechar ela se quiser, e é muito facil de colocar!
Eu fiz 2 modelos prontos, e 1 para modificar de acordo com as cores do seu blog.
Escolha um e pegue o códico na caixinha:
Escolha um e pegue o códico na caixinha:
<!--Começo do script Karen Star ---><style type="text/css">
#topbar{
position:absolute;
border: 2px dashed #ffc9fb;
padding: 10px;
margin: 2% 0 0 55%;
color:#ffc9fb;
background:url(http://karenstar.dominiotemporario.com/valentineback30.gif);
width: 37%;
visibility: hidden;
z-index: 600;
}</style>
<div style="visibility: visible; top: 139px; left: 20px" id="topbar" sp="function(x,y){this.style.left=x+"px";this.style.top=y+"px";}" x="20" y="139.004008097081"><a onclick="closebar(); return false" href=""><img border="0" src="http://karenstar.dominiotemporario.com/th_xiss.gif" /></a><span style="font-size: 12px"><b>Aqui coloque o que quiser. Imagens, mensagens,alertas...Até mesmo umm destaque da semana!... </b></span></div>
<script type="text/javascript">
var persistclose=0 //
var startX = 20 //
var startY = 5 //
var verticalpos="fromtop" //
function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) {
offset += search.length
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}
function closebar(){
if (persistclose)
document.cookie="remainclosed=1"
document.getElementById("topbar").style.visibility="hidden"
}
function staticbar(){
barheight=document.getElementById("topbar").offsetHeight
var ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera;
var d = document;
function ml(id){
var el=d.getElementById(id);
if (!persistclose || persistclose && get_cookie("remainclosed")=="")
el.style.visibility="visible"
if(d.layers)el.style=el;
el.sP=function(x,y){this.style.left=x+"px";this.style.top=y+"px";};
el.x = startX;
if (verticalpos=="fromtop")
el.y = startY;
else{
el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;
el.y -= startY;
}
return el;
}
window.stayTopLeft=function(){
if (verticalpos=="fromtop"){
var pY = ns ? pageYOffset : iecompattest().scrollTop;
ftlObj.y += (pY + startY - ftlObj.y)/8;
}
else{
var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight;
ftlObj.y += (pY - startY - ftlObj.y)/8;
}
ftlObj.sP(ftlObj.x, ftlObj.y);
setTimeout("stayTopLeft()", 10);
}
ftlObj = ml("topbar");
stayTopLeft();
}
if (window.addEventListener)
window.addEventListener("load", staticbar, false)
else if (window.attachEvent)
window.attachEvent("onload", staticbar)
else if (document.getElementById)
window.onload=staticbar
</script><!--Fim do script Karen Star --->
<!--Começo do script Karen Star --->
<style type="text/css">
#topbar{
position:absolute;
border: 2px dashed #66c3e9;
padding: 10px;
margin: 2% 0 0 55%;
color:#66c3e9;
background:url(http://karenstar.dominiotemporario.com/b2c.jpg);
width: 37%;
visibility: hidden;
z-index: 600;
}
</style>
<div id='topbar'>
<a href='' onclick='closebar(); return false'><img border="0" src="http://karenstar.dominiotemporario.com/th_xiss.gif" /></a><span style="font-size: 12px;"><b>Aqui coloque o que quiser. Imagens, mensagens,alertas...Até mesmo umm destaque da semana!...
</b></span>
</div>
<script type="text/javascript">
var persistclose=0 //
var startX = 20 //
var startY = 5 //
var verticalpos="fromtop" //
function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) {
offset += search.length
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}
function closebar(){
if (persistclose)
document.cookie="remainclosed=1"
document.getElementById("topbar").style.visibility="hidden"
}
function staticbar(){
barheight=document.getElementById("topbar").offsetHeight
var ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera;
var d = document;
function ml(id){
var el=d.getElementById(id);
if (!persistclose || persistclose && get_cookie("remainclosed")=="")
el.style.visibility="visible"
if(d.layers)el.style=el;
el.sP=function(x,y){this.style.left=x+"px";this.style.top=y+"px";};
el.x = startX;
if (verticalpos=="fromtop")
el.y = startY;
else{
el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;
el.y -= startY;
}
return el;
}
window.stayTopLeft=function(){
if (verticalpos=="fromtop"){
var pY = ns ? pageYOffset : iecompattest().scrollTop;
ftlObj.y += (pY + startY - ftlObj.y)/8;
}
else{
var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight;
ftlObj.y += (pY - startY - ftlObj.y)/8;
}
ftlObj.sP(ftlObj.x, ftlObj.y);
setTimeout("stayTopLeft()", 10);
}
ftlObj = ml("topbar");
stayTopLeft();
}
if (window.addEventListener)
window.addEventListener("load", staticbar, false)
else if (window.attachEvent)
window.attachEvent("onload", staticbar)
else if (document.getElementById)
window.onload=staticbar
</script>
<!--Fim do script Karen Star --->
Depois de pegar o códico da janela escolhida, vá em:
"Design - Elementos de página"
Click em:
" Adicionar um Gadget - HTML/JavaScript
E cole o códico! E prontinho!
Agora se nenhuma dessas caixinhas combina com o seu blog, pegue este códico abaixo e nele ta explicando onde colocar um fundo, mudar a cor da fonte, colocar outro "x" (para fechar)...
E se não você não tem conhecimento, não mexa mais em nada além de onde esta indicando que pode modificar, para não dá nada errado.
E se não você não tem conhecimento, não mexa mais em nada além de onde esta indicando que pode modificar, para não dá nada errado.
<!--Começo do script Karen Star --->
<style type="text/css">
#topbar{
position:absolute;
border: 2px dashed #000;/*AQUI VOCÊ COLOCA A COR DA BORDA*/
padding: 10px;
margin: 2% 0 0 55%;
color:#000;/*AQUI VOCÊ COLOCA A COR DA FONTE*/
background:url(AQUI VOCÊ COLOCA O ENDEREÇO DO FUNDO QUE VOCÊ QUER);/*ENDEREÇO DO BACKGROUND*/
width: 37%;
visibility: hidden;
z-index: 600;
}
</style>
<div id='topbar'>
<a href='' onclick='closebar(); return false'><img border="0" src="http://karenstar.dominiotemporario.com/th_xiss.gif" /></a><span style="font-size: 12px;"><b>Aqui coloque o que quiser. Imagens, mensagens,alertas...Até mesmo umm destaque da semana!...
</b></span>
</div>
<script type="text/javascript">
var persistclose=0 //
var startX = 20 //
var startY = 5 //
var verticalpos="fromtop" //
function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) {
offset += search.length
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}
function closebar(){
if (persistclose)
document.cookie="remainclosed=1"
document.getElementById("topbar").style.visibility="hidden"
}
function staticbar(){
barheight=document.getElementById("topbar").offsetHeight
var ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera;
var d = document;
function ml(id){
var el=d.getElementById(id);
if (!persistclose || persistclose && get_cookie("remainclosed")=="")
el.style.visibility="visible"
if(d.layers)el.style=el;
el.sP=function(x,y){this.style.left=x+"px";this.style.top=y+"px";};
el.x = startX;
if (verticalpos=="fromtop")
el.y = startY;
else{
el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;
el.y -= startY;
}
return el;
}
window.stayTopLeft=function(){
if (verticalpos=="fromtop"){
var pY = ns ? pageYOffset : iecompattest().scrollTop;
ftlObj.y += (pY + startY - ftlObj.y)/8;
}
else{
var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight;
ftlObj.y += (pY - startY - ftlObj.y)/8;
}
ftlObj.sP(ftlObj.x, ftlObj.y);
setTimeout("stayTopLeft()", 10);
}
ftlObj = ml("topbar");
stayTopLeft();
}
if (window.addEventListener)
window.addEventListener("load", staticbar, false)
else if (window.attachEvent)
window.attachEvent("onload", staticbar)
else if (document.getElementById)
window.onload=staticbar
</script>
<!--Fim do script Karen Star --->
Mensagem ao Entrar no Blog
Copie este códico aqui e cole depois da tag <head>
Ou adicione um gardget/HTML Java Script e cole o códico.
*Substitua o "ESCREVA A MENSAGEM QUE QUER AQUI" pela sua frase.
Mensagem ao Entrar no Blog
Copie este códico aqui e cole depois da tag <head>
Ou adicione um gardget/HTML Java Script e cole o códico.
*Substitua o "ESCREVA A MENSAGEM QUE QUER AQUI" pela sua frase.
Mensagem ao Entrar no Blog
Copie este códico aqui e cole depois da tag <head>
Ou adicione um gardget/HTML Java Script e cole o códico.
*Substitua o "ESCREVA A MENSAGEM QUE QUER AQUI" pela sua frase.
Imagem seguindo o mouse
Adicione um gadget HTML/JAVA SCRIPT:
Substitua o ENDEREÇO DA IMAGEM pelo o endereço do seu blog:
<script type="text/javascript">
imagemcursor = 'ENDEREÇO DA IMAGEM';
</script>
<script type="text/javascript" src="http://dl.dropbox.com/u/5591306/mouse.js"></script>
Imagem seguindo o mouse
Adicione um gadget HTML/JAVA SCRIPT:
Substitua o ENDEREÇO DA IMAGEM pelo o endereço do seu blog:
<script type="text/javascript">
imagemcursor = 'ENDEREÇO DA IMAGEM';
</script>
<script type="text/javascript" src="http://dl.dropbox.com/u/5591306/mouse.js"></script>
Imagem seguindo o mouse
Adicione um gadget HTML/JAVA SCRIPT:
Substitua o ENDEREÇO DA IMAGEM pelo o endereço do seu blog:
<script type="text/javascript">
imagemcursor = 'ENDEREÇO DA IMAGEM';
</script>
<script type="text/javascript" src="http://dl.dropbox.com/u/5591306/mouse.js"></script>
Quantas vezes a pessoa entrou no seu blog
É um script que mostra quantas vezes, a pessoa esteve no seu blog, mais só aparece pra pessoa claro, para colocar o códico no seu blog, basta adicionar um gadget-HTML/JAVA SCRIPT.
<script type="text/javascript">
antes = 'você já visitou esse blog';
depois ='vezes, espero que tenha gostado!';
</script>
<script type="text/javascript" src="http://dl.dropbox.com/u/5591306/visitas.js"></script>
Quantas vezes a pessoa entrou no seu blog
É um script que mostra quantas vezes, a pessoa esteve no seu blog, mais só aparece pra pessoa claro, para colocar o códico no seu blog, basta adicionar um gadget-HTML/JAVA SCRIPT.
<script type="text/javascript">
antes = 'você já visitou esse blog';
depois ='vezes, espero que tenha gostado!';
</script>
<script type="text/javascript" src="http://dl.dropbox.com/u/5591306/visitas.js"></script>
Quantas vezes a pessoa entrou no seu blog
É um script que mostra quantas vezes, a pessoa esteve no seu blog, mais só aparece pra pessoa claro, para colocar o códico no seu blog, basta adicionar um gadget-HTML/JAVA SCRIPT.
<script type="text/javascript">
antes = 'você já visitou esse blog';
depois ='vezes, espero que tenha gostado!';
</script>
<script type="text/javascript" src="http://dl.dropbox.com/u/5591306/visitas.js"></script>
Cursores com textos ou imagens
Voltaram a moda dos cursores com textos seguindo o mouse, estrelinhas etc. E então resolvi deixar uns códicos desses cursores pra vocês.
Se aprendeu aqui credite!
Bom! Vamos aos códicos:
Se vc quer um texto seguindo o cursor: peque este códico e cole no HTML/Javascript;
Não esqueça de escrever o seu texto no local indicado!
<script language="javascript">
//Alterar o Texto que stá dentro das Aspas em baixo:
var text='ESCREVA AQUI O SEU TEXTO';
var delay=40; // altere aqui velocidade
var Xoff=20; // distancia a contar para a direita do cursor (- Valores em negativo vão para a esquerda)
var Yoff=0; //distancia a contar para baixo desde o cursor (- Valores em negativo vão para cima)
var txtw=14; // Espaço que cada caracter ocupa
var beghtml='<font color="#ba476b"><b>';
var endhtml='</b></font>';
//********** Não alterar o código seguinte **********\\
ns4 = (navigator.appName.indexOf("Netscape")>=0 && document.layers)? true : false;
ie4 = (document.all && !document.getElementById)? true : false;
ie5 = (document.all && document.getElementById)? true : false;
ns6 = (document.getElementById && navigator.appName.indexOf("Netscape")>=0 )? true: false;
var txtA=new Array();
text=text.split('');
var x1=0;
var y1=-1000;
var t='';
for(i=1;i<=text.length;i++){
t+=(ns4)? '<layer left="0" top="-100" width="'+txtw+'" name="txt'+i+'" height="1">' : '<div id="txt'+i+'" style="position:absolute; top:-100px; left:0px; height:1px; width:'+txtw+'; visibility:visible;">';
t+=beghtml+text[i-1]+endhtml;
t+=(ns4)? '</layer>' : '</div>';
}
document.write(t);
function moveid(id,x,y){
if(ns4)id.moveTo(x,y);
else{
id.style.left=x+'px';
id.style.top=y+'px';
}}
function animate(evt){
x1=Xoff+((ie4||ie5)?event.clientX+document.body.scrollLeft:evt.pageX);
y1=Yoff+((ie4||ie5)?event.clientY+document.body.scrollTop:evt.pageY);
}
function getidleft(id){
if(ns4)return id.left;
else return parseInt(id.style.left);
}
function getidtop(id){
if(ns4)return id.top;
else return parseInt(id.style.top);
}
function getwindowwidth(){
if(ie4||ie5)return document.body.clientWidth+document.body.scrollLeft;
else return window.innerWidth+pageXOffset;
}
function movetxts(){
for(i=text.length;i>1;i=i-1){
if(getidleft(txtA[i-1])+txtw*2>=getwindowwidth()){
moveid(txtA[i-1],0,-1000);
moveid(txtA[i],0,-1000);
}else moveid(txtA[i], getidleft(txtA[i-1])+txtw, getidtop(txtA[i-1]));
}
moveid(txtA[1],x1,y1);
}
window.onload=function(){
for(i=1;i<=text.length;i++)txtA[i]=(ns4)?document.layers['txt'+i]:(ie4)?document.all['txt'+i]:document.getElementById('txt'+i);
if(ns4)document.captureEvents(Event.MOUSEMOVE);
document.onmousemove=animate;
setInterval('movetxts()',delay);
}
</script>
E se quiser que o texto sguiga ggirando com o mouse tambem cole este códico no HTML/Javascript;
Não esqueça de escrever o seu texto no local indicado!
<script language="javascript">
//Alterar o Texto que stá dentro das Aspas em baixo:
var text='ESCREVA AQUI O SEU TEXTO';
var delay=40; // altere aqui velocidade
var Xoff=20; // distancia a contar para a direita do cursor (- Valores em negativo vão para a esquerda)
var Yoff=0; //distancia a contar para baixo desde o cursor (- Valores em negativo vão para cima)
var txtw=14; // Espaço que cada caracter ocupa
var beghtml='<font color="#ba476b"><b>';
var endhtml='</b></font>';
//********** Não alterar o código seguinte **********\\
ns4 = (navigator.appName.indexOf("Netscape")>=0 && document.layers)? true : false;
ie4 = (document.all && !document.getElementById)? true : false;
ie5 = (document.all && document.getElementById)? true : false;
ns6 = (document.getElementById && navigator.appName.indexOf("Netscape")>=0 )? true: false;
var txtA=new Array();
text=text.split('');
var x1=0;
var y1=-1000;
var t='';
for(i=1;i<=text.length;i++){
t+=(ns4)? '<layer left="0" top="-100" width="'+txtw+'" name="txt'+i+'" height="1">' : '<div id="txt'+i+'" style="position:absolute; top:-100px; left:0px; height:1px; width:'+txtw+'; visibility:visible;">';
t+=beghtml+text[i-1]+endhtml;
t+=(ns4)? '</layer>' : '</div>';
}
document.write(t);
function moveid(id,x,y){
if(ns4)id.moveTo(x,y);
else{
id.style.left=x+'px';
id.style.top=y+'px';
}}
function animate(evt){
x1=Xoff+((ie4||ie5)?event.clientX+document.body.scrollLeft:evt.pageX);
y1=Yoff+((ie4||ie5)?event.clientY+document.body.scrollTop:evt.pageY);
}
function getidleft(id){
if(ns4)return id.left;
else return parseInt(id.style.left);
}
function getidtop(id){
if(ns4)return id.top;
else return parseInt(id.style.top);
}
function getwindowwidth(){
if(ie4||ie5)return document.body.clientWidth+document.body.scrollLeft;
else return window.innerWidth+pageXOffset;
}
function movetxts(){
for(i=text.length;i>1;i=i-1){
if(getidleft(txtA[i-1])+txtw*2>=getwindowwidth()){
moveid(txtA[i-1],0,-1000);
moveid(txtA[i],0,-1000);
}else moveid(txtA[i], getidleft(txtA[i-1])+txtw, getidtop(txtA[i-1]));
}
moveid(txtA[1],x1,y1);
}
window.onload=function(){
for(i=1;i<=text.length;i++)txtA[i]=(ns4)?document.layers['txt'+i]:(ie4)?document.all['txt'+i]:document.getElementById('txt'+i);
if(ns4)document.captureEvents(Event.MOUSEMOVE);
document.onmousemove=animate;
setInterval('movetxts()',delay);
}
</script>
E se quiser uma imagem seguindo o mouse copie este códico e cole antes da tag </head> do HTML do seu blog;
Não esqueça de colocar o endereço da imagem no local indicado
<script type='text/javascript'>
imagemcursor = 'ENDEREÇO DA IMAGEM AQUI'
</script>
<script src='http://www.girlspt.com/cursores/script/mouse.js' type='text/javascript'></script>
Cursores com textos ou imagens
Voltaram a moda dos cursores com textos seguindo o mouse, estrelinhas etc. E então resolvi deixar uns códicos desses cursores pra vocês.
Se aprendeu aqui credite!
Bom! Vamos aos códicos:
Se vc quer um texto seguindo o cursor: peque este códico e cole no HTML/Javascript;
Não esqueça de escrever o seu texto no local indicado!
<script language="javascript">
//Alterar o Texto que stá dentro das Aspas em baixo:
var text='ESCREVA AQUI O SEU TEXTO';
var delay=40; // altere aqui velocidade
var Xoff=20; // distancia a contar para a direita do cursor (- Valores em negativo vão para a esquerda)
var Yoff=0; //distancia a contar para baixo desde o cursor (- Valores em negativo vão para cima)
var txtw=14; // Espaço que cada caracter ocupa
var beghtml='<font color="#ba476b"><b>';
var endhtml='</b></font>';
//********** Não alterar o código seguinte **********\\
ns4 = (navigator.appName.indexOf("Netscape")>=0 && document.layers)? true : false;
ie4 = (document.all && !document.getElementById)? true : false;
ie5 = (document.all && document.getElementById)? true : false;
ns6 = (document.getElementById && navigator.appName.indexOf("Netscape")>=0 )? true: false;
var txtA=new Array();
text=text.split('');
var x1=0;
var y1=-1000;
var t='';
for(i=1;i<=text.length;i++){
t+=(ns4)? '<layer left="0" top="-100" width="'+txtw+'" name="txt'+i+'" height="1">' : '<div id="txt'+i+'" style="position:absolute; top:-100px; left:0px; height:1px; width:'+txtw+'; visibility:visible;">';
t+=beghtml+text[i-1]+endhtml;
t+=(ns4)? '</layer>' : '</div>';
}
document.write(t);
function moveid(id,x,y){
if(ns4)id.moveTo(x,y);
else{
id.style.left=x+'px';
id.style.top=y+'px';
}}
function animate(evt){
x1=Xoff+((ie4||ie5)?event.clientX+document.body.scrollLeft:evt.pageX);
y1=Yoff+((ie4||ie5)?event.clientY+document.body.scrollTop:evt.pageY);
}
function getidleft(id){
if(ns4)return id.left;
else return parseInt(id.style.left);
}
function getidtop(id){
if(ns4)return id.top;
else return parseInt(id.style.top);
}
function getwindowwidth(){
if(ie4||ie5)return document.body.clientWidth+document.body.scrollLeft;
else return window.innerWidth+pageXOffset;
}
function movetxts(){
for(i=text.length;i>1;i=i-1){
if(getidleft(txtA[i-1])+txtw*2>=getwindowwidth()){
moveid(txtA[i-1],0,-1000);
moveid(txtA[i],0,-1000);
}else moveid(txtA[i], getidleft(txtA[i-1])+txtw, getidtop(txtA[i-1]));
}
moveid(txtA[1],x1,y1);
}
window.onload=function(){
for(i=1;i<=text.length;i++)txtA[i]=(ns4)?document.layers['txt'+i]:(ie4)?document.all['txt'+i]:document.getElementById('txt'+i);
if(ns4)document.captureEvents(Event.MOUSEMOVE);
document.onmousemove=animate;
setInterval('movetxts()',delay);
}
</script>
E se quiser que o texto sguiga ggirando com o mouse tambem cole este códico no HTML/Javascript;
Não esqueça de escrever o seu texto no local indicado!
<script language="javascript">
//Alterar o Texto que stá dentro das Aspas em baixo:
var text='ESCREVA AQUI O SEU TEXTO';
var delay=40; // altere aqui velocidade
var Xoff=20; // distancia a contar para a direita do cursor (- Valores em negativo vão para a esquerda)
var Yoff=0; //distancia a contar para baixo desde o cursor (- Valores em negativo vão para cima)
var txtw=14; // Espaço que cada caracter ocupa
var beghtml='<font color="#ba476b"><b>';
var endhtml='</b></font>';
//********** Não alterar o código seguinte **********\\
ns4 = (navigator.appName.indexOf("Netscape")>=0 && document.layers)? true : false;
ie4 = (document.all && !document.getElementById)? true : false;
ie5 = (document.all && document.getElementById)? true : false;
ns6 = (document.getElementById && navigator.appName.indexOf("Netscape")>=0 )? true: false;
var txtA=new Array();
text=text.split('');
var x1=0;
var y1=-1000;
var t='';
for(i=1;i<=text.length;i++){
t+=(ns4)? '<layer left="0" top="-100" width="'+txtw+'" name="txt'+i+'" height="1">' : '<div id="txt'+i+'" style="position:absolute; top:-100px; left:0px; height:1px; width:'+txtw+'; visibility:visible;">';
t+=beghtml+text[i-1]+endhtml;
t+=(ns4)? '</layer>' : '</div>';
}
document.write(t);
function moveid(id,x,y){
if(ns4)id.moveTo(x,y);
else{
id.style.left=x+'px';
id.style.top=y+'px';
}}
function animate(evt){
x1=Xoff+((ie4||ie5)?event.clientX+document.body.scrollLeft:evt.pageX);
y1=Yoff+((ie4||ie5)?event.clientY+document.body.scrollTop:evt.pageY);
}
function getidleft(id){
if(ns4)return id.left;
else return parseInt(id.style.left);
}
function getidtop(id){
if(ns4)return id.top;
else return parseInt(id.style.top);
}
function getwindowwidth(){
if(ie4||ie5)return document.body.clientWidth+document.body.scrollLeft;
else return window.innerWidth+pageXOffset;
}
function movetxts(){
for(i=text.length;i>1;i=i-1){
if(getidleft(txtA[i-1])+txtw*2>=getwindowwidth()){
moveid(txtA[i-1],0,-1000);
moveid(txtA[i],0,-1000);
}else moveid(txtA[i], getidleft(txtA[i-1])+txtw, getidtop(txtA[i-1]));
}
moveid(txtA[1],x1,y1);
}
window.onload=function(){
for(i=1;i<=text.length;i++)txtA[i]=(ns4)?document.layers['txt'+i]:(ie4)?document.all['txt'+i]:document.getElementById('txt'+i);
if(ns4)document.captureEvents(Event.MOUSEMOVE);
document.onmousemove=animate;
setInterval('movetxts()',delay);
}
</script>
E se quiser uma imagem seguindo o mouse copie este códico e cole antes da tag </head> do HTML do seu blog;
Não esqueça de colocar o endereço da imagem no local indicado
<script type='text/javascript'>
imagemcursor = 'ENDEREÇO DA IMAGEM AQUI'
</script>
<script src='http://www.girlspt.com/cursores/script/mouse.js' type='text/javascript'></script>
Cursores com textos ou imagens
Voltaram a moda dos cursores com textos seguindo o mouse, estrelinhas etc. E então resolvi deixar uns códicos desses cursores pra vocês.
Se aprendeu aqui credite!
Bom! Vamos aos códicos:
Se vc quer um texto seguindo o cursor: peque este códico e cole no HTML/Javascript;
Não esqueça de escrever o seu texto no local indicado!
<script language="javascript">
//Alterar o Texto que stá dentro das Aspas em baixo:
var text='ESCREVA AQUI O SEU TEXTO';
var delay=40; // altere aqui velocidade
var Xoff=20; // distancia a contar para a direita do cursor (- Valores em negativo vão para a esquerda)
var Yoff=0; //distancia a contar para baixo desde o cursor (- Valores em negativo vão para cima)
var txtw=14; // Espaço que cada caracter ocupa
var beghtml='<font color="#ba476b"><b>';
var endhtml='</b></font>';
//********** Não alterar o código seguinte **********\\
ns4 = (navigator.appName.indexOf("Netscape")>=0 && document.layers)? true : false;
ie4 = (document.all && !document.getElementById)? true : false;
ie5 = (document.all && document.getElementById)? true : false;
ns6 = (document.getElementById && navigator.appName.indexOf("Netscape")>=0 )? true: false;
var txtA=new Array();
text=text.split('');
var x1=0;
var y1=-1000;
var t='';
for(i=1;i<=text.length;i++){
t+=(ns4)? '<layer left="0" top="-100" width="'+txtw+'" name="txt'+i+'" height="1">' : '<div id="txt'+i+'" style="position:absolute; top:-100px; left:0px; height:1px; width:'+txtw+'; visibility:visible;">';
t+=beghtml+text[i-1]+endhtml;
t+=(ns4)? '</layer>' : '</div>';
}
document.write(t);
function moveid(id,x,y){
if(ns4)id.moveTo(x,y);
else{
id.style.left=x+'px';
id.style.top=y+'px';
}}
function animate(evt){
x1=Xoff+((ie4||ie5)?event.clientX+document.body.scrollLeft:evt.pageX);
y1=Yoff+((ie4||ie5)?event.clientY+document.body.scrollTop:evt.pageY);
}
function getidleft(id){
if(ns4)return id.left;
else return parseInt(id.style.left);
}
function getidtop(id){
if(ns4)return id.top;
else return parseInt(id.style.top);
}
function getwindowwidth(){
if(ie4||ie5)return document.body.clientWidth+document.body.scrollLeft;
else return window.innerWidth+pageXOffset;
}
function movetxts(){
for(i=text.length;i>1;i=i-1){
if(getidleft(txtA[i-1])+txtw*2>=getwindowwidth()){
moveid(txtA[i-1],0,-1000);
moveid(txtA[i],0,-1000);
}else moveid(txtA[i], getidleft(txtA[i-1])+txtw, getidtop(txtA[i-1]));
}
moveid(txtA[1],x1,y1);
}
window.onload=function(){
for(i=1;i<=text.length;i++)txtA[i]=(ns4)?document.layers['txt'+i]:(ie4)?document.all['txt'+i]:document.getElementById('txt'+i);
if(ns4)document.captureEvents(Event.MOUSEMOVE);
document.onmousemove=animate;
setInterval('movetxts()',delay);
}
</script>
E se quiser que o texto sguiga ggirando com o mouse tambem cole este códico no HTML/Javascript;
Não esqueça de escrever o seu texto no local indicado!
<script language="javascript">
//Alterar o Texto que stá dentro das Aspas em baixo:
var text='ESCREVA AQUI O SEU TEXTO';
var delay=40; // altere aqui velocidade
var Xoff=20; // distancia a contar para a direita do cursor (- Valores em negativo vão para a esquerda)
var Yoff=0; //distancia a contar para baixo desde o cursor (- Valores em negativo vão para cima)
var txtw=14; // Espaço que cada caracter ocupa
var beghtml='<font color="#ba476b"><b>';
var endhtml='</b></font>';
//********** Não alterar o código seguinte **********\\
ns4 = (navigator.appName.indexOf("Netscape")>=0 && document.layers)? true : false;
ie4 = (document.all && !document.getElementById)? true : false;
ie5 = (document.all && document.getElementById)? true : false;
ns6 = (document.getElementById && navigator.appName.indexOf("Netscape")>=0 )? true: false;
var txtA=new Array();
text=text.split('');
var x1=0;
var y1=-1000;
var t='';
for(i=1;i<=text.length;i++){
t+=(ns4)? '<layer left="0" top="-100" width="'+txtw+'" name="txt'+i+'" height="1">' : '<div id="txt'+i+'" style="position:absolute; top:-100px; left:0px; height:1px; width:'+txtw+'; visibility:visible;">';
t+=beghtml+text[i-1]+endhtml;
t+=(ns4)? '</layer>' : '</div>';
}
document.write(t);
function moveid(id,x,y){
if(ns4)id.moveTo(x,y);
else{
id.style.left=x+'px';
id.style.top=y+'px';
}}
function animate(evt){
x1=Xoff+((ie4||ie5)?event.clientX+document.body.scrollLeft:evt.pageX);
y1=Yoff+((ie4||ie5)?event.clientY+document.body.scrollTop:evt.pageY);
}
function getidleft(id){
if(ns4)return id.left;
else return parseInt(id.style.left);
}
function getidtop(id){
if(ns4)return id.top;
else return parseInt(id.style.top);
}
function getwindowwidth(){
if(ie4||ie5)return document.body.clientWidth+document.body.scrollLeft;
else return window.innerWidth+pageXOffset;
}
function movetxts(){
for(i=text.length;i>1;i=i-1){
if(getidleft(txtA[i-1])+txtw*2>=getwindowwidth()){
moveid(txtA[i-1],0,-1000);
moveid(txtA[i],0,-1000);
}else moveid(txtA[i], getidleft(txtA[i-1])+txtw, getidtop(txtA[i-1]));
}
moveid(txtA[1],x1,y1);
}
window.onload=function(){
for(i=1;i<=text.length;i++)txtA[i]=(ns4)?document.layers['txt'+i]:(ie4)?document.all['txt'+i]:document.getElementById('txt'+i);
if(ns4)document.captureEvents(Event.MOUSEMOVE);
document.onmousemove=animate;
setInterval('movetxts()',delay);
}
</script>
E se quiser uma imagem seguindo o mouse copie este códico e cole antes da tag </head> do HTML do seu blog;
Não esqueça de colocar o endereço da imagem no local indicado
<script type='text/javascript'>
imagemcursor = 'ENDEREÇO DA IMAGEM AQUI'
</script>
<script src='http://www.girlspt.com/cursores/script/mouse.js' type='text/javascript'></script>
Galeria de imagens
Colocando um galeria de imagens no Blogger
Parace um slide, e é muito útil pra blogs que querem demontrar uns produtos, ou vender, ou demonstrar imagens ou enfeitar...
É só usar a criatividade, fica assim:
Gostou? Se quiser colocar um no seu blog siga as instruções abaixo:
Vá no HTML do seu blog e procure por (procure com Ctrl+f):
]]></b:skin>
E cole acima dele o seguinte códico:
Vá no HTML do seu blog e procure por (procure com Ctrl+f):
]]></b:skin>
E cole acima dele o seguinte códico:
/* Gallery images-------------------------------------- */
#gallery{
-moz-box-shadow:0 0 3px #AAAAAA;
-webkit-box-shadow:0 0 3px #AAAAAA;
box-shadow:0 0 3px #AAAAAA;
-moz-border-radius-bottomleft:4px;
-webkit-border-bottom-left-radius:4px;
border-bottom-left-radius:4px;
-moz-border-radius-bottomright:4px;
-webkit-border-bottom-right-radius:4px;
border-bottom-right-radius:4px;
border:1px solid white;
background:#FEe9ea;/*cor de fundo do slide menor*/
width:540px;
margin: 2px 3px 1px 8px;
border: 2px dotted #FCB4B7;/*cor da borda mude se quiser*/
overflow:hidden;
}
#slides{
height:350px;
width:920px;
overflow:hidden;
}
.slide{
float:left;
}
#menu{
height:60px;
}
ul#gal{
margin:0px;
padding:0px;
}
#gal li{
width:57px;
display:inline-block;
list-style:none;
height:55px;
overflow:hidden;
}
#gal li.inact:hover{
background:transparent;
}
#gal li.act,li.act:hover{
background:#FEe9ea; /*cor do menu mude se quiser*/
}
#gal li.act a{
cursor:default;
}
.fbar{
width:2px;
background:transparent;
}
#gal li a{
display:block;
background:#FCB4B7;/*cor de cima do menu pequeno*/
height:35px;
padding-top:10px;
}
.a img{border:none;}
Agora abaixo de:
]]></b:skin>
Cole este código:
]]></b:skin>
Cole este código:
<!-- slide-->
style="color: #444444; font-family: Georgia,"Times New Roman",serif;"> <!--[if lte IE 7]>
<style type="text/css">
ul li{
display:inline;
/*float:left;*/
}
</style>
<![endif]-->
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function(){
/* This code is executed after the DOM has been completely loaded */
var totWidth=0;
var positions = new Array();
$('#slides .slide').each(function(i){
/* Traverse through all the slides and store their accumulative widths in totWidth */
positions[i]= totWidth;
totWidth += $(this).width();
/* The positions array contains each slide's commulutative offset from the left part of the container */
if(!$(this).width())
{
alert("Please, fill in width & height for all your images!");
return false;
}
});
$('#slides').width(totWidth);
/* Change the cotnainer div's width to the exact width of all the slides combined */
$('#menu ul li a').click(function(e){
/* On a thumbnail click */
$('li.menuItem').removeClass('act').addClass('inact');
$(this).parent().addClass('act');
var pos = $(this).parent().prevAll('.menuItem').length;
$('#slides').stop().animate({marginLeft:-positions[pos]+'px'},450);
/* Start the sliding animation */
e.preventDefault();
/* Prevent the default action of the link */
});
$('#menu ul li.menuItem:first').addClass('act').siblings().addClass('inact');
/* On page load, mark the first thumbnail as active */
});
//]]></script>
Agora procure por:
<div id='main-wrapper'>
E cole abaixo dele este seguinte códico:
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<!-- TROQUE ABAIXO O ENDEREÇO PELO DE SUAS IMAGENS -->
<div id='contentWrapperPortfolio'><div id='gallery'><div id='slides'>
<div class='slide'><img alt='side' height='469' src='ENDEREÇO DA IMAGEM 1' width='572'/></div>
<div class='slide'><img alt='side' height='469' src='ENDEREÇO DA IMAGEM 2' width='572'/></div>
<div class='slide'><img alt='side' height='469' src='ENDEREÇO DA IMAGEM 3' width='572'/></div>
<div class='slide'><img alt='side' height='469' src='ENDEREÇO DA IMAGEM 4' width='572'/></div>
<div class='slide'><img alt='side' height='469' src='ENDEREÇO DA IMAGEM 5' width='572'/></div>
<div class='slide'><img alt='side' height='469' src='ENDEREÇO DA IMAGEM 6' width='702'/></div>
<div class='slide'><img alt='side' height='469' src='ENDEREÇO DA IMAGEM 7' width='572'/></div>
<div class='slide'><img alt='side' height='469' src='ENDEREÇO DA IMAGEM 8' width='572'/></div>
<div class='slide'><img alt='side' height='469' src='ENDEREÇO DA IMAGEM 9' width='572'/></div>
</div><div id='menu'><ul id='gal'>
<!-- AQUI É A PARTE MENOR MAIS JA TA CONFIGURADO PRA FICAR PEQUENO ENTÃO TROQUE ABAIXO O ENDEREÇO PELAS MESMAS FOTOS MAIORES -->
<li class='menuItem'><a href=''><img alt='thumbnail' src='ENDEREÇO DA IMAGEM 1' width='70px'/></a></li>
<li class='menuItem'><a href=''><img alt='thumbnail' src='ENDEREÇO DA IMAGEM 2' width='70px'/></a></li>
<li class='menuItem'><a href=''><img alt='thumbnail' src='ENDEREÇO DA IMAGEM 3' width='70px'/></a></li>
<li class='menuItem'><a href=''><img alt='thumbnail' src='ENDEREÇO DA IMAGEM 4' width='70px'/></a></li>
<li class='menuItem'><a href=''><img alt='thumbnail' src='ENDEREÇO DA IMAGEM 5' width='70px'/></a></li>
<li class='menuItem'><a href=''><img alt='thumbnail' src='ENDEREÇO DA IMAGEM 6' width='70px'/></a></li>
<li class='menuItem'><a href=''><img alt='thumbnail' src='ENDEREÇO DA IMAGEM 7' width='70px'/></a></li>
<li class='menuItem'><a href=''><img alt='thumbnail' src='ENDEREÇO DA IMAGEM 8' width='70px'/></a></li>
<li class='menuItem'><a href=''><img alt='thumbnail' src='ENDEREÇO DA IMAGEM 9' width='70px'/></a></li>
<li class='fbar'/>
</ul>
</div>
</div>
</div>
</b:if>
</b:if>
Gente é só isso, e já sabem né?! Se aprendeu aqui creditem.
Beijão
Assinar:
Postagens (Atom)