Layout Free: Amnesia Ukyo

Yo minna-san, como vão todos? Eu super feliz Segunda vou ao cinema ver Percy Jackson e o Mar de Monstros, seria mais feliz ir com meu namorado, mas infelizmente não terá como. Mas parando de tagaralágitar, (trocadilho de tagarelar com digitar) venho trazer mais um layout free para vocês. Este layout é super simples, se o anterior era simples este é mais ainda. Já estava planejando a muito tempo fazer um template do Ukyo do anime Amnesia, porém sempre acabava não fazendo.Os que amam efeitos vão se decepcionar um pouco com este layout... Ae se não me engano foi na postagem anterior, me perguntaram se faço layouts exclusivos por encomenda. Infelizmente não faço, isso só da dor de cabeça. Mas podem pedir um layout free se eu achar imagens legais e sair um layout decente eu posto aqui no blog.

O menu principal se arruma por dentro do HTML. Achei que fico mais divertido assim e um pouco diferente só deu um trabalho pra caramba para arrumar e colocar onde eu queria, mas acho que facilitara na hora de arruma, mas fiquei feliz com o resultado final. Também o coloquei para o ladinho não sei se vão gostar... o layout e de colunas pequenas.Vocês podem adicionar o menu que quiserem e efeito de imagens, fica a critério de vocês, mas acho que sutis e ficarão mais bonitos. Eu tava pensando em fazer também dos outros personagens principais... mas acho que seria perca de tempo.

 DEMO || DOWNLOAD || LINK DIRETO|| HTML

No pack se encontra: Tabela de cores + template.

Regras:

-Não remover os créditos

-Não disponibilizar para download

-Não falar que foi você que fez

-Se for usar o layout, comente

-Pode fazer pequenas modificações, mas não remova os créditos  

OBS: O arquivo de Layout que vem no pack, está com problemas e está sendo analisado... peço desculpas a todos que não conseguiram estalar o layout. Por isso coloquei uma nova opção de pegar o código aberto do layout no link "HTML". É só copiar e colar. Em breve o link estara disponível para download e instalação direta. 

Arrumando o Layout:

~Menu Principal~

Fiz o menu um pouco diferente dos anteriores, ele é editado por dentro do HTML, abaixo deixarei o tutorial mostrando como arrumar. Entre no HTML e procure por </body>, abaixo dele vai encontrar o menu. Então coloque os links:

<li><a href='SEU-LINK-AQUI' title='#'>Home</a></li>
<li><a href='SEU-LINK-AQUI' title='#'>About</a></li>

Wellcome:

<br/>
<a href="http://www.blogger.com/" target="blank" title="Theme Karneval"><img src="http://static.tumblr.com/zwx9bqk/2VDmrlmhu/well_2.png" height="78" width="181" /></a>

Elite:

<br/><div style="text-align: center;">
<a href="LINK" title="NOME"><img class="efeito-awn-isa" src="http://static.tumblr.com/zwx9bqk/dGsmrlf5m/af.png" /></a>
<a href="LINK" title="NOME"><img class="efeito-awn-isa" src="http://static.tumblr.com/zwx9bqk/dGsmrlf5m/af.png" /></a></div>

Efeito de subir ao topo:

Se quiser adicionar o bonequinho de subir ao topo como no layout é só adicionar esse código em qualquer gadget, ou em um novo gadget:

<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="http://static.tumblr.com/zwx9bqk/dqwmrni76/top.png"/>', //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:'Scroll Back to Top'}) .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> 

Bem é isso, espero que gostem do layout. Então ate a próxima minna-san.