10 de dez. de 2014

1° Tutorial do blog na área galera!



imagemOi gente!Cheguei,com o primeiro tutu do blog!
esse vai ser como colocar botão subir ao topo com efeito deslizante,que nem o do blog
eu achei lindo,e é fofo!
clique em Leia Mais e veja como é que se faz!






Créditos do tutu:pqngarota.blogspot.com.br
Vá em Layout,Adionar um Gadget,HTML JavaScrip e cole em conteúdo:

<SCRIPT TYPE="TEXT/JAVASCRIPT" SRC="HTTP://AJAX.GOOGLEAPIS.COM/AJAX/LIBS/JQUERY/1.3.2/JQUERY.MIN.JS"></SCRIPT>
<SCRIPT TYPE='TEXT/JAVASCRIPT' LANGUAGE='JAVASCRIPT'>
VAR SCROLLTOTOP={
//STARTLINE: INTEGER. NUMBER OF PIXELS FROM TOP OF DOC SCROLLBAR IS SCROLLED BEFORE SHOWING CONTROL
//SCROLLTO: KEYWORD (INTEGER, OR "SCROLL_TO_ELEMENT_ID"). HOW FAR TO SCROLL DOCUMENT UP WHEN CONTROL IS CLICKED ON (1=TOP).
SETTING: {STARTLINE:100, SCROLLTO: 0, SCROLLDURATION:1000, FADEDURATION:[500, 100]},
CONTROLHTML: '<IMG SRC="COLOQUE AQUI O URL DA IMAGEM"/>', //HTML FOR CONTROL, WHICH IS AUTO WRAPPED IN DIV W/ ID="TOPCONTROL"
CONTROLATTRS: {OFFSETX:5, OFFSETY:5}, //OFFSET OF CONTROL RELATIVE TO RIGHT/ CENTER OF WINDOW CORNER
ANCHORKEYWORD: '#TOP', //ENTER HREF VALUE OF HTML ANCHORS ON THE PAGE THAT SHOULD ALSO ACT AS "SCROLL UP" LINKS
STATE: {ISVISIBLE:FALSE, SHOULDVISIBLE:FALSE},
SCROLLUP:FUNCTION(){
IF (!THIS.CSSFIXEDSUPPORT) //IF CONTROL IS POSITIONED USING JAVASCRIPT
THIS.$CONTROL.CSS({OPACITY:0}) //HIDE CONTROL IMMEDIATELY AFTER CLICKING IT
VAR DEST=ISNAN(THIS.SETTING.SCROLLTO)? THIS.SETTING.SCROLLTO : PARSEINT(THIS.SETTING.SCROLLTO)
IF (TYPEOF DEST=="STRING" && JQUERY('#'+DEST).LENGTH==1) //CHECK ELEMENT SET BY STRING EXISTS
DEST=JQUERY('#'+DEST).OFFSET().TOP
ELSE
DEST=0
THIS.$BODY.ANIMATE({SCROLLTOP: DEST}, THIS.SETTING.SCROLLDURATION);
},
KEEPFIXED:FUNCTION(){
VAR $WINDOW=JQUERY(WINDOW)
VAR CONTROLX=$WINDOW.SCROLLLEFT() + $WINDOW.WIDTH() - THIS.$CONTROL.WIDTH() - THIS.CONTROLATTRS.OFFSETX
VAR CONTROLY=$WINDOW.SCROLLTOP() + $WINDOW.HEIGHT() - THIS.$CONTROL.HEIGHT() - THIS.CONTROLATTRS.OFFSETY
THIS.$CONTROL.CSS({LEFT:CONTROLX+'PX', TOP:CONTROLY+'PX'})
},
TOGGLECONTROL:FUNCTION(){
VAR SCROLLTOP=JQUERY(WINDOW).SCROLLTOP()
IF (!THIS.CSSFIXEDSUPPORT)
THIS.KEEPFIXED()
THIS.STATE.SHOULDVISIBLE=(SCROLLTOP>=THIS.SETTING.STARTLINE)? TRUE : FALSE
IF (THIS.STATE.SHOULDVISIBLE && !THIS.STATE.ISVISIBLE){
THIS.$CONTROL.STOP().ANIMATE({OPACITY:1}, THIS.SETTING.FADEDURATION[0])
THIS.STATE.ISVISIBLE=TRUE
}
ELSE IF (THIS.STATE.SHOULDVISIBLE==FALSE && THIS.STATE.ISVISIBLE){
THIS.$CONTROL.STOP().ANIMATE({OPACITY:0}, THIS.SETTING.FADEDURATION[1])
THIS.STATE.ISVISIBLE=FALSE
}
},
INIT:FUNCTION(){
JQUERY(DOCUMENT).READY(FUNCTION($){
VAR MAINOBJ=SCROLLTOTOP
VAR IEBRWS=DOCUMENT.ALL
MAINOBJ.CSSFIXEDSUPPORT=!IEBRWS || IEBRWS && DOCUMENT.COMPATMODE=="CSS1COMPAT" && WINDOW.XMLHTTPREQUEST //NOT IE OR IE7+ BROWSERS IN STANDARDS MODE
MAINOBJ.$BODY=(WINDOW.OPERA)? (DOCUMENT.COMPATMODE=="CSS1COMPAT"? $('HTML') : $('BODY')) : $('HTML,BODY')
MAINOBJ.$CONTROL=$('<DIV ID="TOPCONTROL">'+MAINOBJ.CONTROLHTML+'</DIV>')
.CSS({POSITION:MAINOBJ.CSSFIXEDSUPPORT? 'FIXED' : 'ABSOLUTE', BOTTOM:MAINOBJ.CONTROLATTRS.OFFSETY, RIGHT:MAINOBJ.CONTROLATTRS.OFFSETX, OPACITY:0, CURSOR:'POINTER'})
.ATTR({TITLE:''})
.CLICK(FUNCTION(){MAINOBJ.SCROLLUP(); RETURN FALSE})
.APPENDTO('BODY')
IF (DOCUMENT.ALL && !WINDOW.XMLHTTPREQUEST && MAINOBJ.$CONTROL.TEXT()!='') //LOOSE CHECK FOR IE6 AND BELOW, PLUS WHETHER CONTROL CONTAINS ANY TEXT
MAINOBJ.$CONTROL.CSS({WIDTH:MAINOBJ.$CONTROL.WIDTH()}) //IE6- SEEMS TO REQUIRE AN EXPLICIT WIDTH ON A DIV CONTAINING TEXT
MAINOBJ.TOGGLECONTROL()
$('A[HREF="' + MAINOBJ.ANCHORKEYWORD +'"]').CLICK(FUNCTION(){
MAINOBJ.SCROLLUP()
RETURN FALSE
})
$(WINDOW).BIND('SCROLL RESIZE', FUNCTION(E){
MAINOBJ.TOGGLECONTROL()
})
})
}
}
SCROLLTOTOP.INIT()
</SCRIPT>
E onde está destacado,você coloca a URL da imagem! Bye povo! Tamara Vick.

Nenhum comentário:

Postar um comentário

Oi!Estou feliz por comentar,mais siga essas regras:
Comente com respeito;
Comente com educação;
Quer criticar?Leia novamente as duas primeiras regras desse texto.
Duvídas?Comente,e com respeito,viu?
Sei que ninguém vai ler isso,mais mesmo assim,coloquei ^.^
Se leu mesmo,parabéns!E pode comentar!Mais que não leu também pode!