oloque um menu em seu blog que é um slide. Vá até o HTML do seu blog e cole o código abaixo acima de:
<!-- Slide-->
<script src='http://jqueryjs.googlecode.com/files/jquery-1.2.6.min.js' type='text/javascript'/>
<script type='text/javascript'><!--//--><![CDATA[//><!--
sfHover = function() {
var sfEls = document.getElementById("catmenu").getElementsByTagName("LI");
for (var i=0; i<sfEls.length; i++) {
sfEls[i].onmouseover=function() {
this.className+=" sfhover";
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);
//--><!]]></script>
<script type='text/javascript'>
if (window.jstiming) window.jstiming.load.tick('headEnd');
</script>
<!-- Fim Slide-->
<script type='text/javascript'>
//<![CDATA[
// SET THIS VARIABLE FOR DELAY, 1000 = 1 SECOND
var delayLength = 4000;
function doMove(panelWidth, tooFar) {
var leftValue = $("#mover").css("left");
// Fix for IE
if (leftValue == "auto") { leftValue = 0; };
var movement = parseFloat(leftValue, 10) - panelWidth;
if (movement == tooFar) {
$(".slide img").animate({
"top": -200
}, function() {
$("#mover").animate({
"left": 0
}, function() {
$(".slide img").animate({
"top": 50
});
});
});
}
else {
$(".slide img").animate({
"top": -200
}, function() {
$("#mover").animate({
"left": movement
}, function() {
$(".slide img").animate({
"top": 50
});
});
});
}
}
$(function(){
var $slide1 = $(".slide");
var panelWidth = $slide1.css("width");
var panelPaddingLeft = $slide1.css("paddingLeft");
var panelPaddingRight = $slide1.css("paddingRight");
panelWidth = parseFloat(panelWidth, 10);
panelPaddingLeft = parseFloat(panelPaddingLeft, 10);
panelPaddingRight = parseFloat(panelPaddingRight, 10);
panelWidth = panelWidth + panelPaddingLeft + panelPaddingRight;
var numPanels = $(".slide").length;
var tooFar = -(panelWidth * numPanels);
var totalMoverwidth = numPanels * panelWidth;
$("#mover").css("width", totalMoverwidth);
$("#slider").append('<a href="#" id="slider-stopper">Parar</a>');
sliderIntervalID = setInterval(function(){
doMove(panelWidth, tooFar);
}, delayLength);
$("#slider-stopper").click(function(){
if ($(this).text() == "Stop") {
clearInterval(sliderIntervalID);
$(this).text("Start");
}
else {
sliderIntervalID = setInterval(function(){
doMove(panelWidth, tooFar);
}, delayLength);
$(this).text("Stop");
}
});
});
//]]>
</script>
<!-- Slider -->
<div id='slider'>
<div id='mover'>
<div class='slide'>
<h2><a href='AQUI O ENDEREÇO DO LINK' title='Clique-me'>
TÍTULO
</a></h2>
<span class='slmet'>SUB-TÍTULO</span>
<br/>
<p>TEXTO AQUI</p>
<img alt='' src='ENDEREÇO DA IMAGEM'/>
</div>
<div class='slide'>
<h2><a href='AQUI O ENDEREÇO DO LINK' title='Clique-me'>
TÍTULO
</a></h2>
<span class='slmet'>SUB-TÍTULO</span>
<br/>
<p>TEXTO AQUI</p>
<img alt='' src='ENDEREÇO DA IMAGEM'/>
</div>
<div class='slide'>
<h2><a href='AQUI O ENDEREÇO DO LINK' title='Clique-me'>
TÍTULO
</a></h2>
<span class='slmet'>SUB-TÍTULO</span>
<br/>
<p>TEXTO AQUI</p>
<img alt='' src='ENDEREÇO DA IMAGEM'/>
</div>
<div class='slide'>
<h2><a href='AQUI O ENDEREÇO DO LINK' title='Clique-me'>
TÍTULO
</a></h2>
<span class='slmet'>SUB-TÍTULO</span>
<br/>
<p>TEXTO AQUI</p>
<img alt='' src='ENDEREÇO DA IMAGEM'/>
</div>
<div class='slide'>
<h2><a href='AQUI O ENDEREÇO DO LINK' title='Clique-me'>
TÍTULO
</a></h2>
<span class='slmet'>SUB-TÍTULO</span>
<br/>
<p>TEXTO AQUI</p>
<img alt='' src='ENDEREÇO DA IMAGEM'/>
</div>
<div class='slide'>
<h2><a href='AQUI O ENDEREÇO DO LINK' title='Clique-me'>
TÍTULO
</a></h2>
<span class='slmet'>SUB-TÍTULO</span>
<br/>
<p>TEXTO AQUI</p>
<img alt='' src='ENDEREÇO DA IMAGEM'/>
</div>
<div class='slide'>
<h2><a href='AQUI O ENDEREÇO DO LINK' title='Clique-me'>
TÍTULO
</a></h2>
<span class='slmet'>SUB-TÍTULO</span>
<br/>
<p>TEXTO AQUI</p>
<img alt='' src='ENDEREÇO DA IMAGEM'/>
</div>
</div>
<!-- /Mover -->
</div>
<!-- /Slider -->
Abaixo, alguns fundos em cores diferentes para o slide. Clique sobre a imagem desejada e salve em seu computador, hospedando em seu blog a imagem e colocando o endereço no primeiro código na inscrição na cor vermelha.
