Isto é uma pré-visualização de um tema em Hitskin.com
Instalar o tema • Voltar para a ficha do tema
Background diferente para cada membro
+3
.Danni.
DaniloKoD
Azure
7 participantes
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre a aparência do fórum :: Questões resolvidas sobre a aparência do fórum
Página 1 de 2
Página 1 de 2 • 1, 2
Background diferente para cada membro
Qual é minha questão:
Eu vi esse tutorial do Background diferente para cada membro e eu querisa saber o seguinte o meu fórum tem uma imagem de fundo com 1280 de largura, no entanto em ecrãs grandes a imagem não ocupa a largura total. Se eu coloco uma imagem maior, ela fica cortada num ecrã mais pequeno.
Como eu faço para a imagem de fundo esticar ou encolher de forma a ocupar sempre 100% da largura do ecrã utilizando o esse tutorial?
https://ajuda.forumeiros.com/t71210-tutorial-background-diferente-para-cada-membro
Endereço do meu fórum:
http://v2-0.forumeiros.com
Versão do fórum:
PUNBB
Eu vi esse tutorial do Background diferente para cada membro e eu querisa saber o seguinte o meu fórum tem uma imagem de fundo com 1280 de largura, no entanto em ecrãs grandes a imagem não ocupa a largura total. Se eu coloco uma imagem maior, ela fica cortada num ecrã mais pequeno.
Como eu faço para a imagem de fundo esticar ou encolher de forma a ocupar sempre 100% da largura do ecrã utilizando o esse tutorial?
https://ajuda.forumeiros.com/t71210-tutorial-background-diferente-para-cada-membro
Endereço do meu fórum:
http://v2-0.forumeiros.com
Versão do fórum:
PUNBB
Última edição por Azure em 05.05.13 4:29, editado 1 vez(es)
Re: Background diferente para cada membro
Já tentei isso utilizando outro computador e não funcionou!
Re: Background diferente para cada membro
Olá,
Infelizmente não existe código que altere o tamanho do background de uma página, o que pode fazer é utilizar uma imagem grande o suficiente para funcionar em todas as telas.
Cordialmentem
The Boss
Infelizmente não existe código que altere o tamanho do background de uma página, o que pode fazer é utilizar uma imagem grande o suficiente para funcionar em todas as telas.
Cordialmentem
The Boss
Re: Background diferente para cada membro
logico que existe já vi alguns fóruns com essa função!
este fórum por exemplo tem essa função
http://odisseia.forumais.com/
não importa a resolução do seu seu monitor a imagem está sempre completa se você utilizar o zoom a imagem também não se altera!
este fórum por exemplo tem essa função
http://odisseia.forumais.com/
não importa a resolução do seu seu monitor a imagem está sempre completa se você utilizar o zoom a imagem também não se altera!
Re: Background diferente para cada membro
Olá,
Tente este CSS:
Cordialmente,
The Boss
Tente este CSS:
- Código:
body{background-attachment:fixed;background-color:#361010;background-image:url(http://www.mmog-welt.de/bilder/guild-wars-2/14.jpg);color:#d9d9d9;font-family:Arial, Helvetica, sans-serif;font-size:10px;height:auto;padding:10px 0}
body{background-size: 100%;filter:alpha(opacity=93);-moz-opacity:0.93;opacity:0.93;}
Cordialmente,
The Boss
Re: Background diferente para cada membro
Funciono agora como eu faço para aplicar esse efeito nesse tutorial!
- Código:
#custom_background{background-image:url('http://i31.servimg.com/u/f31/17/41/76/40/backgr21.jpg') !important;box-shadow:0 0 10px rgba(0,0,0,0.8) inset;color:#FFF;position:relative;padding:15px 0 15px 15px}
#custom_background span{-moz-transition:all .2s ease-in-out 0;background:none no-repeat scroll 50% 50% #000;border-radius:7px 7px 7px 7px;box-shadow:0 1px 7px #000 inset, 0 1px 0 rgba(255,255,255,0.05), 0 0 1px rgba(255,255,255,0.35);cursor:pointer;display:block;float:left;height:90px;margin-right:15px;width:140px}
#custom_background span:hover{box-shadow:0 1px 2px #000 inset, 0 1px 0 rgba(255,255,255,0.05), 0 0 1px rgba(255,255,255,0.35)}
#bg1{background-image:url(http://i31.servimg.com/u/f31/17/41/76/40/backgr22.jpg)!important;background-repeat:repeat-x!important}
#bg6{background-image:url(http://i31.servimg.com/u/f31/17/41/76/40/backgr23.jpg)!important}
#bg5{background-image:url(http://i31.servimg.com/u/f31/17/41/76/40/backgr24.jpg)!important}
#bg2{background-image:url(http://i31.servimg.com/u/f31/17/41/76/40/backgr25.jpg)!important}
#bg3{background-image:url(http://i31.servimg.com/u/f31/17/41/76/40/guitar10.jpg)!important}
#bg4{background-image:url(http://i31.servimg.com/u/f31/17/41/76/40/backgr21.jpg)!important}
#custom_url{clear:left;padding-top:10px;text-align:center}
#custom_input{background:none repeat scroll 0 0 rgba(0,0,0,0.5);border:0 none;border-radius:4px 4px 4px 4px;box-shadow:0 1px 3px rgba(0,0,0,0.75) inset, 0 1px 0 rgba(255,255,255,0.15);color:#FFF;font-size:20px;height:40px;margin-left:-15px;margin-right:8px;white-space:nowrap;width:780px;padding:0 10px 0 0}
#custom_submit{background:url(http://i48.servimg.com/u/f48/16/58/89/73/highli10.png) repeat-x scroll 0 0 rgba(197,206,213,0.4);border-radius:4px 4px 4px 4px;box-shadow:0 1px 3px rgba(0,0,0,0.6);color:#FFF;cursor:pointer;display:inline-block;font-size:20px;font-weight:400;line-height:40px;text-shadow:0 -1px 0 #4C5057;padding:0 10px}
.bg1{background:url(http://i31.servimg.com/u/f31/17/41/76/40/backgr22.jpg) repeat fixed 50% 0 #000!important}
.bg2{background:url(http://i31.servimg.com/u/f31/17/41/76/40/backgr33.jpg) no-repeat fixed 50% 0 #000!important}
.bg3{background:url(http://i31.servimg.com/u/f31/17/41/76/40/guitar10.jpg) repeat fixed 50% 0 #000!important}
.bg4{background:url(http://i31.servimg.com/u/f31/17/41/76/40/backgr27.jpg) repeat fixed 50% 0 #000!important}
.bg5{background:url(http://i31.servimg.com/u/f31/17/41/76/40/backgr32.jpg) no-repeat fixed 50% 0 #0E1E2D!important}
.bg6{background:url(http://i31.servimg.com/u/f31/17/41/76/40/backgr31.jpg) no-repeat fixed 50% 0 #000!important}
.bg_custom{background-attachment:fixed;background-color:#000;background-repeat:repeat}
#nav_background{background-color:#000;border:3px dotted #444!important;border-radius:15px 15px 15px 15px;cursor:pointer;float:right;padding:5px}
#nav_background:hover{background-color:#FFF}
#nav_background:active{background-color:#E71E7B}
Re: Background diferente para cada membro
Olá,
Tente este códgo:
Cordialmente,
The Boss
Tente este códgo:
- Código:
#custom_background{background-size: 100%;filter:alpha(opacity=93);-moz-opacity:0.93;opacity:0.93; background-attachment:fixed;background-color:#361010; background-image:url('http://i31.servimg.com/u/f31/17/41/76/40/backgr21.jpg') !important;box-shadow:0 0 10px rgba(0,0,0,0.8) inset;color:#FFF;position:relative;padding:15px 0 15px 15px}
#custom_background span{-moz-transition:all .2s ease-in-out 0;background:none no-repeat scroll 50% 50% #000;border-radius:7px 7px 7px 7px;box-shadow:0 1px 7px #000 inset, 0 1px 0 rgba(255,255,255,0.05), 0 0 1px rgba(255,255,255,0.35);cursor:pointer;display:block;float:left;height:90px;margin-right:15px;width:140px}
#custom_background span:hover{box-shadow:0 1px 2px #000 inset, 0 1px 0 rgba(255,255,255,0.05), 0 0 1px rgba(255,255,255,0.35)}
#bg1{background-image:url(http://i31.servimg.com/u/f31/17/41/76/40/backgr22.jpg)!important;background-repeat:repeat-x!important}
#bg6{background-image:url(http://i31.servimg.com/u/f31/17/41/76/40/backgr23.jpg)!important}
#bg5{background-image:url(http://i31.servimg.com/u/f31/17/41/76/40/backgr24.jpg)!important}
#bg2{background-image:url(http://i31.servimg.com/u/f31/17/41/76/40/backgr25.jpg)!important}
#bg3{background-image:url(http://i31.servimg.com/u/f31/17/41/76/40/guitar10.jpg)!important}
#bg4{background-image:url(http://i31.servimg.com/u/f31/17/41/76/40/backgr21.jpg)!important}
#custom_url{clear:left;padding-top:10px;text-align:center}
#custom_input{background:none repeat scroll 0 0 rgba(0,0,0,0.5);border:0 none;border-radius:4px 4px 4px 4px;box-shadow:0 1px 3px rgba(0,0,0,0.75) inset, 0 1px 0 rgba(255,255,255,0.15);color:#FFF;font-size:20px;height:40px;margin-left:-15px;margin-right:8px;white-space:nowrap;width:780px;padding:0 10px 0 0}
#custom_submit{background:url(http://i48.servimg.com/u/f48/16/58/89/73/highli10.png) repeat-x scroll 0 0 rgba(197,206,213,0.4);border-radius:4px 4px 4px 4px;box-shadow:0 1px 3px rgba(0,0,0,0.6);color:#FFF;cursor:pointer;display:inline-block;font-size:20px;font-weight:400;line-height:40px;text-shadow:0 -1px 0 #4C5057;padding:0 10px}
.bg1{background:url(http://i31.servimg.com/u/f31/17/41/76/40/backgr22.jpg) repeat fixed 50% 0 #000!important}
.bg2{background:url(http://i31.servimg.com/u/f31/17/41/76/40/backgr33.jpg) no-repeat fixed 50% 0 #000!important}
.bg3{background:url(http://i31.servimg.com/u/f31/17/41/76/40/guitar10.jpg) repeat fixed 50% 0 #000!important}
.bg4{background:url(http://i31.servimg.com/u/f31/17/41/76/40/backgr27.jpg) repeat fixed 50% 0 #000!important}
.bg5{background:url(http://i31.servimg.com/u/f31/17/41/76/40/backgr32.jpg) no-repeat fixed 50% 0 #0E1E2D!important}
.bg6{background:url(http://i31.servimg.com/u/f31/17/41/76/40/backgr31.jpg) no-repeat fixed 50% 0 #000!important}
.bg_custom{background-attachment:fixed;background-color:#000;background-repeat:repeat}
#nav_background{background-color:#000;border:3px dotted #444!important;border-radius:15px 15px 15px 15px;cursor:pointer;float:right;padding:5px}
#nav_background:hover{background-color:#FFF}
#nav_background:active{background-color:#E71E7B}
Cordialmente,
The Boss
Re: Background diferente para cada membro
Saudação!
Aceda à "Gestão dos códigos JavaScript":
Painel de Controle Módulos Gestão dos códigos JavaScript
Clique em "Criar um novo JavaScript".
Título Escolha o título que quiser
Investimento Em todas as páginas
Código JavaScript:
Clique em "Confirmar".
Até mais!
Aceda à "Gestão dos códigos JavaScript":
Painel de Controle Módulos Gestão dos códigos JavaScript
Clique em "Criar um novo JavaScript".
Título Escolha o título que quiser
Investimento Em todas as páginas
Código JavaScript:
- Código:
jQuery(document).ready(function(){if(window.location.href=='http://narutostorm-online.forumeiros.com/f9-kumogakure'){jQuery('body').attr('style','background-image:url(http://images.wikia.com/naruto/images/a/ad/Kumo.png)')};if(window.location.href=='http://narutostorm-online.forumeiros.com/f8-kirigakure'){jQuery('body').attr('style','background-image:url(http://images.wikia.com/naruto/images/7/71/Kirivillage.png)')};if(window.location.href=='http://narutostorm-online.forumeiros.com/f7-iwagakure'){jQuery('body').attr('style','background-image:url(http://images.wikia.com/naruto/images/e/ea/Iwavillage.png)')};if(window.location.href=='http://narutostorm-online.forumeiros.com/f6-konohagakure'){jQuery('body').attr('style','background-image:url(http://rpgbrasil.com.br/wp-content/uploads/2010/08/Konoha.jpg)')};if(window.location.href=='http://narutostorm-online.forumeiros.com/f10-sunagakure'){jQuery('body').attr('style','background-image:url(http://images.wikia.com/naruto/images/1/16/Sunavillage.png)')};if(window.location.href=='http://narutostorm-online.forumeiros.com/f21-lugares-e-esconderijos-ocultos'){jQuery('body').attr('style','background-image:url(http://www.animay.net/gallery2/albums/NarutoShipp/182/Naruto_Shippuuden_182-057.jpg)')};if(window.location.href=='http://narutostorm-online.forumeiros.com/f27-esconderijo-da-akatsuki'){jQuery('body').attr('style','background-image:url(http://tiagobigode.com.br/download/Imagens/Naruto/121-Aqueles_que_se_movem-akatsuki.jpg)')};if(window.location.href=='http://narutostorm-online.forumeiros.com/f32-montanha-myoboku'){jQuery('body').attr('style','background-image:url(http://images.wikia.com/naruto/images/8/86/The_Sacred_Oil_Fountain_And_The_Status_Surrounding_It.PNG)')};if(window.location.href=='http://narutostorm-online.forumeiros.com/f30-arena-internacional'){jQuery('body').attr('style','background-image:url(http://www.animay.net/gallery2/albums/NarutoxUT/Naruto_Shippuuden-NarutoxUT-061.jpg)')}})
Clique em "Confirmar".
Até mais!
Re: Background diferente para cada membro
Olá!
Amigo, o código funciona perfeitamente, veja: http://temasbr.forumeiros.com/
Se a imagem não abrange todo o ecrã é porque não tem o tamanho correto da página (altura, melhor dizendo).
Melhores cumprimentos,
seender
Amigo, o código funciona perfeitamente, veja: http://temasbr.forumeiros.com/
Se a imagem não abrange todo o ecrã é porque não tem o tamanho correto da página (altura, melhor dizendo).
Melhores cumprimentos,
seender
Re: Background diferente para cada membro
Eu não disse que o código não funciona o que eu disse é que se eu mudar a imagem ela não atinge a resolução completa do meu monitor ou ela ultrapassa segue abaixo o código que eu utilizo
- Código:
#custom_background{background-size: 100%;filter:alpha(opacity=93);-moz-opacity:0.93;opacity:0.93; background-attachment:fixed;background-color:#361010; background-image:url('http://i31.servimg.com/u/f31/17/41/76/40/backgr21.jpg') !important;box-shadow:0 0 10px rgba(0,0,0,0.8) inset;color:#FFF;position:relative;padding:15px 0 15px 15px}
#custom_background span{-moz-transition:all .2s ease-in-out 0;background:none no-repeat scroll 50% 50% #000;border-radius:7px 7px 7px 7px;box-shadow:0 1px 7px #000 inset, 0 1px 0 rgba(255,255,255,0.05), 0 0 1px rgba(255,255,255,0.35);cursor:pointer;display:block;float:left;height:90px;margin-right:15px;width:140px}
#custom_background span:hover{box-shadow:0 1px 2px #000 inset, 0 1px 0 rgba(255,255,255,0.05), 0 0 1px rgba(255,255,255,0.35)}
#bg1{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/zerg11.jpg)!important;background-repeat:repeat-x!important}
#bg6{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/1jimra10.png)!important;background-repeat:repeat-x!important}
#bg5{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/1tychu10.png)!important}
#bg2{background-image:url(http://i1359.photobucket.com/albums/q800/azure91/Forum/protoss_zpsc0553b1f.jpg)!important}
#bg3{background-image:url(http://i1359.photobucket.com/albums/q800/azure91/Forum/fundo_zps7e8c3ea7.jpg)!important}
#bg4{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/1kerri10.png)!important}
#custom_url{clear:left;padding-top:10px;text-align:center}
#custom_input{background:none repeat scroll 0 0 rgba(0,0,0,0.5);border:0 none;border-radius:4px 4px 4px 4px;box-shadow:0 1px 3px rgba(0,0,0,0.75) inset, 0 1px 0 rgba(255,255,255,0.15);color:#FFF;font-size:20px;height:40px;margin-left:-15px;margin-right:8px;white-space:nowrap;width:780px;padding:0 10px 0 0}
#custom_submit{background:url(http://i48.servimg.com/u/f48/16/58/89/73/highli10.png) repeat-x scroll 0 0 rgba(197,206,213,0.4);border-radius:4px 4px 4px 4px;box-shadow:0 1px 3px rgba(0,0,0,0.6);color:#FFF;cursor:pointer;display:inline-block;font-size:20px;font-weight:400;line-height:40px;text-shadow:0 -1px 0 #4C5057;padding:0 10px}
.bg1{background:url(http://i72.servimg.com/u/f72/17/41/76/40/zerg11.jpg) repeat fixed 50% 0 #000!important}
.bg2{background:url(http://i1359.photobucket.com/albums/q800/azure91/Forum/protoss_zpsc0553b1f.jpg) repeat fixed 50% 0 #000!important}
.bg3{background:url(http://i1359.photobucket.com/albums/q800/azure91/Forum/fundo_zps7e8c3ea7.jpg) repeat fixed 50% 0 #000!important}
.bg4{background:url(http://i72.servimg.com/u/f72/17/41/76/40/kerrig12.jpg) repeat fixed 50% 0 #000!important}
.bg5{background:url(http://i72.servimg.com/u/f72/17/41/76/40/tychus11.jpg) fixed 100% 0 #0E1E2D!important}
.bg6{background:url(http://i72.servimg.com/u/f72/17/41/76/40/jim_ra10.jpg) repeat fixed 50% 0 #000!important}
.bg_custom{background-attachment:fixed;background-color:#000;background-repeat:repeat}
#nav_background{background-color:#000;border:3px dotted #444!important;border-radius:15px 15px 15px 15px;cursor:pointer;float:right;padding:5px}
#nav_background:hover{background-color:#FFF}
#nav_background:active{background-color:#E71E7B}
Re: Background diferente para cada membro
Olá,
Pode passar o HTML que esse CSS formata para que eu faça as alterações e as teste?
Cordialmente,
The Boss
Pode passar o HTML que esse CSS formata para que eu faça as alterações e as teste?
Cordialmente,
The Boss
Re: Background diferente para cada membro
css do emu fórum:
Código java utilizado
- Código:
p.message{background: rgba(255, 255, 255, .3) !important;}
/*-- Ocultar Widgets --*/
*+ html #content-container div#main {
margin-left: 0px;
}
#content-container div#left {
width: 0px;
float: left;
margin-right: 0px;
overflow: hidden;
}
#content-container div#right {
width: 0px;
float: right;
overflow: hidden;
}
* html #content-container #main-content {
/* FIX for IE6... For some reason, if we insert comment before this series, the star html hack don't work no more... ?? */
overflow: visible;
margin-right: 183px;
}
* html #content-container div#main {
/* FIX for IE6 */
margin-right: -99%;
width: 100%;
float: left; }
/* Membros */
.Sname a{background-color:#FFF;border:1px solid #DDD;margin:2px;padding:1px 5px}
.Sname a:hover,.Sname a:active{background-color:#2F98D9;color:#FFF}
.Sname{text-align:right}
.rutgonML img{background-color:#000;border:3px double;border-radius:7px 7px 7px 7px;height:75px;width:72%;margin:10px}
.rutgonML{float:left;width:10%}
.rutgonML p{background-color:#C2BFBF;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:0 2px;padding:2px 5px}
.rutgonML:hover{box-shadow:0 0 10px 5px #000}
/* Menu footer */
#footerSw {
width: 100%;
background: #262626;
color: #E1E1E1;
padding: 1em 1em 1em 10em;
text-align: center;
display: table;
border-top:3px solid #111;
}
#footerSw > li {
position: absolute;
right: 5em;
bottom: 2em;
}
#footerSw {
position: relative !important;
}
#footerSw p {
margin: 20px 0px;
float: left;
font:12px Tahoma;
}
#footerSw ul {
float: left;
list-style: none;
text-align: center;
margin: 0 auto;
width: 15em;
padding: 1em;
}
#footerSw li {
display: block;
padding: 1px;
text-align: left;
}
#footerSw h2 {
font: 20px "Century Gothic", Verdana, Geneva, sans-serif;
color: #F60;
margin-bottom:6px;
}
#footerSw a {
color: #F1F1F1;
text-decoration: none;
}
/* Fundo Personalizado */
#custom_background{background-size: 100%;filter:alpha(opacity=93);-moz-opacity:0.93;opacity:0.93; background-attachment:fixed;background-color:#361010; background-image:url('http://i31.servimg.com/u/f31/17/41/76/40/backgr21.jpg') !important;box-shadow:0 0 10px rgba(0,0,0,0.8) inset;color:#FFF;position:relative;padding:15px 0 15px 15px}
#custom_background span{-moz-transition:all .2s ease-in-out 0;background:none no-repeat scroll 50% 50% #000;border-radius:7px 7px 7px 7px;box-shadow:0 1px 7px #000 inset, 0 1px 0 rgba(255,255,255,0.05), 0 0 1px rgba(255,255,255,0.35);cursor:pointer;display:block;float:left;height:90px;margin-right:15px;width:140px}
#custom_background span:hover{box-shadow:0 1px 2px #000 inset, 0 1px 0 rgba(255,255,255,0.05), 0 0 1px rgba(255,255,255,0.35)}
#bg1{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/zerg11.jpg)!important;background-repeat:repeat-x!important}
#bg6{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/1jimra10.png)!important;background-repeat:repeat-x!important}
#bg5{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/1tychu10.png)!important}
#bg2{background-image:url(http://i1359.photobucket.com/albums/q800/azure91/Forum/protoss_zpsc0553b1f.jpg)!important}
#bg3{background-image:url(http://i1359.photobucket.com/albums/q800/azure91/Forum/fundo_zps7e8c3ea7.jpg)!important}
#bg4{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/1kerri10.png)!important}
#custom_url{clear:left;padding-top:10px;text-align:center}
#custom_input{background:none repeat scroll 0 0 rgba(0,0,0,0.5);border:0 none;border-radius:4px 4px 4px 4px;box-shadow:0 1px 3px rgba(0,0,0,0.75) inset, 0 1px 0 rgba(255,255,255,0.15);color:#FFF;font-size:20px;height:40px;margin-left:-15px;margin-right:8px;white-space:nowrap;width:780px;padding:0 10px 0 0}
#custom_submit{background:url(http://i48.servimg.com/u/f48/16/58/89/73/highli10.png) repeat-x scroll 0 0 rgba(197,206,213,0.4);border-radius:4px 4px 4px 4px;box-shadow:0 1px 3px rgba(0,0,0,0.6);color:#FFF;cursor:pointer;display:inline-block;font-size:20px;font-weight:400;line-height:40px;text-shadow:0 -1px 0 #4C5057;padding:0 10px}
.bg1{background:url(http://i72.servimg.com/u/f72/17/41/76/40/zerg11.jpg) repeat fixed 50% 0 #000!important}
.bg2{background:url(http://i1359.photobucket.com/albums/q800/azure91/Forum/protoss_zpsc0553b1f.jpg) repeat fixed 50% 0 #000!important}
.bg3{background:url(http://i1359.photobucket.com/albums/q800/azure91/Forum/fundo_zps7e8c3ea7.jpg) repeat fixed 50% 0 #000!important}
.bg4{background:url(http://i72.servimg.com/u/f72/17/41/76/40/kerrig12.jpg) repeat fixed 50% 0 #000!important}
.bg5{background:url(http://i72.servimg.com/u/f72/17/41/76/40/tychus11.jpg) fixed 100% 0 #0E1E2D!important}
.bg6{background:url(http://i72.servimg.com/u/f72/17/41/76/40/jim_ra10.jpg) repeat fixed 50% 0 #000!important}
.bg_custom{background-attachment:fixed;background-color:#000;background-repeat:repeat}
#nav_background{background-color:#000;border:3px dotted #444!important;border-radius:15px 15px 15px 15px;cursor:pointer;float:right;padding:5px}
#nav_background:hover{background-color:#FFF}
#nav_background:active{background-color:#E71E7B}
/* Styles Forum */
.postfoot {
clear: both;
margin-left: -17em;
-top: 1px #ccc;
background: rgba(255, 255, 255, .2);
background-repeat: repeat-x;
padding: 0.5em 1em;
text-align: right;
border-top: 1px solid #ffffff;
}
.pun .posthead {
background: rgba(255, 255, 255, .2);
border-bottom: 1px solid #ccc;
}
.pathname-box p{display:none!important}
#pun-navlinks li a:hover {color: white;
text-decoration: none!important;}
#pun-navlinks ul {
list-style: none;
text-align: left;
width: 980px;
margin: auto;
}
#stats {
margin: 0 auto !important;
text-align: center !important;
display: table;
background: none;
}
.statHide{display:none !important;}
.statsPers li span a {
text-decoration: none !important;
}
.statsPers li > span {
padding: 5px 8px;
background: #E1E1E1;
box-shadow: inset rgba(0, 0, 0, 0.3) 0px 1px 2px, rgba(255, 255, 255, 1) 0px 1px 0px;
-moz-box-shadow: inset rgba(0, 0, 0, 0.3) 0px 1px 2px, rgba(255, 255, 255, 1) 0px 1px 0px;
-webkit-box-shadow: inset rgba(0, 0, 0, 0.3) 0px 1px 2px, rgba(255, 255, 255, 1) 0px 1px 0px;
-o-box-shadow: inset rgba(0, 0, 0, 0.3) 0px 1px 2px, rgba(255, 255, 255, 1) 0px 1px 0px;
border: 1px solid #E1E1E1;
margin-bottom: 10px;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
-o-border-radius: 3px;
text-shadow: 1px 1px 0 white;
color: #111;
font-weight: 700;
}
.statsPers li {
float: left;
color:#666;
margin: 2px 10px;
}
.statsPers {
list-style: none;
display: block;
margin: 0px auto;
width: 100%;
}
* {
margin: 0;
padding: 0;
}
.pun {
width: 990px;
margin: 0 auto;
}
#pun-navlinks {
display: none;
}
#page-body {
background: rgba(255, 255, 255, .1);
width: 970px;
padding: 10px;
-moz-border-radius: 4px;
-webkit-border-radius:4px;
border-radius: 4px;
margin-top: 10px;
border: 1px solid #252c36;
overflow: hidden;
}
#controlbar {
background: url('') no-repeat;
background: rgba(255, 255, 255, .3);
width: 960px;
height: 50px;
clear: both;
padding: 0 10px;
line-height: 50px;
margin-bottom: 10px;
}
ul#nav {
height: 50px;
}
ul#nav li.menuitem {
float: left;
margin-right: 15px;
list-style: none;
margin-top: none;
margin-bottom: none;
}
ul#nav li a {
font-size: 13px;
font-weight: bold;
padding-left: 20px;
}
ul#nav li.home {
background: url('http://i1359.photobucket.com/albums/q800/azure91/Forum/home10_zps5e53ab7e.png') no-repeat left center;
}
ul#nav li.users {
background: url('http://i1359.photobucket.com/albums/q800/azure91/Forum/users10_zps5085b394.png') no-repeat left center;
}
ul#nav li.search {
background: url('http://i1359.photobucket.com/albums/q800/azure91/Forum/search10_zps068ff1ba.png') no-repeat left center;
}
ul#nav li.logout {
background: url('http://i1359.photobucket.com/albums/q800/azure91/Forum/icon-l10_zpsbfa6e02b.png') no-repeat left center;
float: right;
}
ul#nav li.profile{
background: url('http://i1359.photobucket.com/albums/q800/azure91/Forum/ucp10_zps0b1b9e0e.png') no-repeat left center;
}
ul#nav li.inbox {
background: url('http://i1359.photobucket.com/albums/q800/azure91/Forum/icon-p10_zps8a9602fe.png') no-repeat left center;
}
ul#nav li.register {
background: url('http://i1359.photobucket.com/albums/q800/azure91/Forum/icon-r10_zps5541e9a8.png') no-repeat left center;
}
ul#nav li.login {
background: url('http://i1359.photobucket.com/albums/q800/azure91/Forum/icon-l10_zpsbfa6e02b.png') no-repeat left center;
}
#user_info {
width: 320px;
height: 120px;
border: 1px solid #bcd8e6;
border-bottom: 3px solid #bcd8e6;
padding: 10px;
background: url('http://i41.servimg.com/u/f41/16/01/61/63/topgra10.gif') repeat-x ;
background: rgba(255, 255, 255, .1);
}
#user_wrap {
margin-top: 23px;
}
.fl { float: left; }
#pun-visit {
display: none;
}
#pndcwidget {
background: url('http://i43.servimg.com/u/f43/16/93/80/74/sideba10.png') no-repeat;
position: fixed;
left: 0;
margin-top: 150px;
height: 82px;
width: 23px;
display: block !important;
z-index: 999;
}
.widget-button {
display: block;
height: 16px;
margin-bottom: 8px;
margin-left: 3px;
}
#user_avatar img {
width: 75px;
height: 85px;
padding-right: 10px;
margin-top: 20px;
}
#user_name {
font-weight: bold;
}
.main-head {
margin-top: 10px;
-moz-border-radius: 3px 3px 0 0;
-webkit-border-radius: 3px 3px 0 0;
border-radius: 3px 3px 0 0;
}
.user-info {
margin-bottom: 5px;
}
#user_info ul li {
list-style: none;
padding-left: 10px;
}
.pun table td.tcl {
height: 60px;
min-height: 60px;
max-height: 60px;
}
.pun table td.tcl {
vertical-align: middle !important;
}
.pun table.table td {
padding-bottom: 0px !important;
}
.pun table .tcl{
width: 70% !important;
}
.tc2 {
border-left: none !important;
border-right: none !important;
}
.tc3 {
border-left: none !important;
}
.status {
margin-top: 5px;
}
.pun table.table td {
padding-top: 0em !important;
}
.main .main-foot, .main .main-head {
background: url('');
background: rgba(255, 255, 255, .3);
height: 35px;
border: 1px solid #fff;
padding: 0px !important;
line-height: 30px;
}
.postbit {
background: url('http://i43.servimg.com/u/f43/16/93/80/74/postbi10.png') no-repeat;
width: 74px;
height: 38px;
padding-top: 3px;
}
.user-info span {
color: #000000;
font-size: 11px;
}
.post_field {
background: rgba(255, 255, 255, .1);
color:#4d5153;
border:1px solid #d6dee1;
padding:3px 3px 3px 10px;
margin-top: 2px;
text-align:left;
}
.pun .paged-foot, .pun .paged-head { border: none; background: none; }
.pun .paged .posting {
margin-right: -15px;
}
.vote {
float: right;
width: 16px;
margin-left: 4px;
}
.codebox {
width: 95%;
}
.frm-info {
border: none;
background: rgba(255, 255, 255, .3);
padding-left: 30px !important;
}
#pun-intro {
background: none;
border: none;
}
.pun table .tdtopics .status {
margin-top: -1px;
}
#pun-about{ text-align: center;
border: none;}
#pun-about ul li a {
color: #fff;
text-decoration: none!important;
text-align: center;
border: none;
}
#ol_time {
float: right;
background: #F4F4F4;
border: 1px solid #ddd;
border-radius: 0 0 3px 3px;
padding: 5px 10px;
border-top: none;
margin-top: -12px;
}
#tabs {
margin-left: -20px;
}
.options { display:none; }
.user-info img {vertical-align: middle; }
/* Color Picker Styles */
#color, #wcolor {overflow: visible;}
#colorpicker {position: absolute; top: 20px; left: -225px;}
#grid {border: 1px solid #808080;}
#grid td {padding: 0px;}
#grid td button {height: 12px; width: 12px; padding: 0px; border: 1px solid #808080;}
#grid td button:hover {border: 1px solid #ffffff;
}
/*Tipsy Styles*/
.tipsy { padding: 5px; font-size: 10px; opacity: 0.8; filter: alpha(opacity=80); background-repeat: no-repeat; background-image: url('http://i43.servimg.com/u/f43/16/93/80/74/tipsy10.gif'); }
.tipsy-inner { padding: 5px 8px 4px 8px; background-color: black; color: white; max-width: 200px; text-align: center; }
.tipsy-inner { -moz-border-radius:3px; -webkit-border-radius:3px; }
.tipsy-north { background-position: top center; }
.tipsy-south { background-position: bottom center; }
.tipsy-east { background-position: right center; }
.tipsy-west { background-position: left center; }
/* Username Styles */
.pun .user-ident .username a[href="/u1"], #onlinelist [href="/u1"], .statused a[href="/u1"], #stats [href="/u1"], #chatbox_members a[href="/u1"], #chatbox a[href="/u1"], #onlinechat a[href="/u1"], #profile-advanced-right div.h3 strong, .module a[href="/u1"] {
background: url('http://i43.servimg.com/u/f43/16/93/80/74/09211.png') no-repeat left center !important;
padding-left: 14px;
height: 16px;
}
.pun .user-ident .username a[href="/u3"], #onlinelist [href="/u3"], .statused a[href="/u3"], #stats [href="/u3"], #chatbox_members a[href="/u3"], #chatbox a[href="/u3"], #onlinechat a[href="/u3"], #profile-advanced-right div.h3 strong, .module a[href="/u3"] {
background: url('http://i43.servimg.com/u/f43/16/93/80/74/08811.png') no-repeat left center !important;
padding-left: 14px;
height: 16px;
}
.pun .user-ident .username a[href="/u5"], #onlinelist [href="/u5"], .statused a[href="/u5"], #stats [href="/u5"], #chatbox_members a[href="/u5"], #chatbox a[href="/u5"], #onlinechat a[href="/u5"], #profile-advanced-right div.h3 strong, .module a[href="/u5"] {
background: url('http://i49.servimg.com/u/f49/15/99/90/75/08510.png') no-repeat left center !important;
padding-left: 14px;
height: 16px;
}
.pun .user-ident .username a[href="/u6"], #onlinelist [href="/u6"], .statused a[href="/u6"], #stats [href="/u6"], #chatbox_members a[href="/u6"], #chatbox a[href="/u6"], #onlinechat a[href="/u6"], #profile-advanced-right div.h3 strong, .module a[href="/u6"] {
background: url('http://i43.servimg.com/u/f43/16/93/80/74/09011.png') no-repeat left center !important;
padding-left: 14px;
height: 16px;
}
/* Notification Styles */
div.jGrowl {
z-index: 999;
color: #fff;
font-size: 12px;
}
/** Special IE6 Style Positioning **/
div.ie6 {
position: absolute;
}
div.ie6.top-right {
right: auto;
bottom: auto;
left: expression( ( 0 - jGrowl.offsetWidth + ( document.documentElement.clientWidth ? document.documentElement.clientWidth : document.body.clientWidth ) + ( ignoreMe2 = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft ) ) + 'px' );
top: expression( ( 0 + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ) ) + 'px' );
}
div.ie6.top-left {
left: expression( ( 0 + ( ignoreMe2 = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft ) ) + 'px' );
top: expression( ( 0 + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ) ) + 'px' );
}
div.ie6.bottom-right {
left: expression( ( 0 - jGrowl.offsetWidth + ( document.documentElement.clientWidth ? document.documentElement.clientWidth : document.body.clientWidth ) + ( ignoreMe2 = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft ) ) + 'px' );
top: expression( ( 0 - jGrowl.offsetHeight + ( document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight ) + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ) ) + 'px' );
}
div.ie6.bottom-left {
left: expression( ( 0 + ( ignoreMe2 = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft ) ) + 'px' );
top: expression( ( 0 - jGrowl.offsetHeight + ( document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight ) + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ) ) + 'px' );
}
div.ie6.center {
left: expression( ( 0 + ( ignoreMe2 = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft ) ) + 'px' );
top: expression( ( 0 + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ) ) + 'px' );
width: 100%;
}
/** Normal Style Positions **/
div.jGrowl {
position: absolute;
}
body > div.jGrowl {
position: fixed;
}
div.jGrowl.top-left {
left: 0px;
top: 0px;
}
div.jGrowl.top-right {
right: 0px;
top: 0px;
}
div.jGrowl.bottom-left {
left: 0px;
bottom: 0px;
}
div.jGrowl.bottom-right {
right: 0px;
bottom: 0px;
}
div.jGrowl.center {
top: 0px;
width: 50%;
left: 25%;
}
/** Cross Browser Styling **/
div.center div.jGrowl-notification, div.center div.jGrowl-closer {
margin-left: auto;
margin-right: auto;
}
div.jGrowl div.jGrowl-notification, div.jGrowl div.jGrowl-closer {
background-color: #000;
opacity: .85;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)";
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=85);
zoom: 1;
width: 235px;
padding: 10px;
margin-top: 5px;
margin-bottom: 5px;
font-family: Tahoma, Arial, Helvetica, sans-serif;
font-size: 1em;
text-align: left;
display: none;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}
div.jGrowl div.jGrowl-notification {
min-height: 40px;
}
div.jGrowl div.jGrowl-notification,
div.jGrowl div.jGrowl-closer {
margin: 10px;
}
div.jGrowl div.jGrowl-notification div.jGrowl-header {
font-weight: bold;
font-size: .85em;
}
div.jGrowl div.jGrowl-notification div.jGrowl-close {
z-index: 99;
float: right;
font-weight: bold;
font-size: 1em;
cursor: pointer;
}
div.jGrowl div.jGrowl-closer {
padding-top: 4px;
padding-bottom: 4px;
cursor: pointer;
font-size: .9em;
font-weight: bold;
text-align: center;
}
/** Hide jGrowl when printing **/
@media print {
div.jGrowl {
display: none;
}
}
.fade {
display:inline-block;
background: -moz-linear-gradient(left, rgb(255,255,225) 0%, rgba(255,255,225,0) 100%);
background-image: -webkit-gradient(linear, left top, right top, color-stop(0.00, rgb(255,255,225)), color-stop(1.00, rgba(255,255,225,0)));
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffe1, endColorstr=#00ffffe1, GradientType=1);
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffe1, endColorstr=#00ffffe1, GradientType=1)";
}
.blur {
display:inline-block;
color:#ddd;
text-shadow: 0 0 2px #aaaaaa;
text-shadow: 0 0 4px #aaaaaa;
text-shadow: 0 0 6px #aaaaaa;
-ms-filter: "progid:DXImageTransform.Microsoft.Blur(pixelradius=2)";
filter:
progid:DXImageTransform.Microsoft.MotionBlur(strength=1,direction=310)
progid:DXImageTransform.Microsoft.Blur(pixelradius=2);
}
.flipH {
display:inline-block;
-moz-transform:scale(-1,1);
-o-transform:scale(-1,1);
-webkit-transform:scale(-1,1);
transform:scale(-1,1);
-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=-1, M12=0, M21=0, M22=1, SizingMethod='auto expand')";
filter: progid:DXImageTransform.Microsoft.Matrix(
M11=-1,
M12=0,
M21=0,
M22=1,
SizingMethod="auto expand");
}
.flipV {
display:inline-block;
-moz-transform:scale(1,-1);
-o-transform:scale(1,-1);
-webkit-transform:scale(1,-1);
transform:scale(1,-1);
-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1, M12=0, M21=0, M22=-1, SizingMethod='auto expand')";
filter: progid:DXImageTransform.Microsoft.Matrix(
M11=1,
M12=0,
M21=0,
M22=-1,
SizingMethod="auto expand");
}
Código java utilizado
- Código:
$(function () {
$("#pun-intro").prepend('<img src="http://i31.servimg.com/u/f31/17/41/76/40/nav_ba10.png" alt="Change background image" title="Trocar a imagem de fundo" id="nav_background" />');
$("#content").prepend('<div id="toggle_background" style="display: none;"><div id="custom_background"><span id="bg1"></span><span id="bg6"></span><span id="bg5"></span><span id="bg2"></span><span id="bg3"></span><span id="bg4"></span><div id="custom_url"><input type="text" placeholder=" Endereço de outra imagem" id="custom_input"><strong id="custom_submit">Aplicar</strong></div></div></div>');
$("#custom_background span").click(function () {
$("body").removeClass("bg1 bg2 bg3 bg4 bg5 bg6 bg_custom").addClass($(this).attr("id"));
my_setcookie("custom_background", $(this).attr("id"), true);
});
$("#custom_submit").click(function () {
var urlbg = $("#custom_input").val();
$("body, .main-head, .main-foot, #pun-intro").removeClass("bg1 bg2 bg3 bg4 bg5 bg6 bg_custom").addClass("bg_custom").css("background-image", "url('" + urlbg + "')");
my_setcookie("custom_background", urlbg, true);
});
$("#nav_background").click(function () {
$("#toggle_background").slideToggle()
});
if (my_getcookie("custom_background") != "") {
if (my_getcookie("custom_background").length > 4) {
$("body, .main-head, .main-foot, #pun-intro").addClass("bg_custom").css("background-image", "url(" + my_getcookie("custom_background") + ")");
} else {
$("body").addClass(my_getcookie("custom_background"))
}
}
});
Re: Background diferente para cada membro
Olá,
Tente agora:
Testei no meu fórum de testes e funcionou: http://templatesqueen.forumais.com/forum
Cordialmente,
The Boss
Tente agora:
- Código:
p.message{background: rgba(255, 255, 255, .3) !important;}
/*-- Ocultar Widgets --*/
*+ html #content-container div#main {
margin-left: 0px;
}
#content-container div#left {
width: 0px;
float: left;
margin-right: 0px;
overflow: hidden;
}
#content-container div#right {
width: 0px;
float: right;
overflow: hidden;
}
* html #content-container #main-content {
/* FIX for IE6... For some reason, if we insert comment before this series, the star html hack don't work no more... ?? */
overflow: visible;
margin-right: 183px;
}
* html #content-container div#main {
/* FIX for IE6 */
margin-right: -99%;
width: 100%;
float: left; }
/* Membros */
.Sname a{background-color:#FFF;border:1px solid #DDD;margin:2px;padding:1px 5px}
.Sname a:hover,.Sname a:active{background-color:#2F98D9;color:#FFF}
.Sname{text-align:right}
.rutgonML img{background-color:#000;border:3px double;border-radius:7px 7px 7px 7px;height:75px;width:72%;margin:10px}
.rutgonML{float:left;width:10%}
.rutgonML p{background-color:#C2BFBF;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:0 2px;padding:2px 5px}
.rutgonML:hover{box-shadow:0 0 10px 5px #000}
/* Menu footer */
#footerSw {
width: 100%;
background: #262626;
color: #E1E1E1;
padding: 1em 1em 1em 10em;
text-align: center;
display: table;
border-top:3px solid #111;
}
#footerSw > li {
position: absolute;
right: 5em;
bottom: 2em;
}
#footerSw {
position: relative !important;
}
#footerSw p {
margin: 20px 0px;
float: left;
font:12px Tahoma;
}
#footerSw ul {
float: left;
list-style: none;
text-align: center;
margin: 0 auto;
width: 15em;
padding: 1em;
}
#footerSw li {
display: block;
padding: 1px;
text-align: left;
}
#footerSw h2 {
font: 20px "Century Gothic", Verdana, Geneva, sans-serif;
color: #F60;
margin-bottom:6px;
}
#footerSw a {
color: #F1F1F1;
text-decoration: none;
}
/* Fundo Personalizado */
body{background-attachment:fixed;}
body{background-size: 100%;filter:alpha(opacity=93);-moz-opacity:0.93;opacity:0.93;}
#custom_background{background-attachment:fixed; background-size: 100%; box-shadow:0 0 10px rgba(0,0,0,0.8) inset;color:#FFF;position:relative;padding:15px 0 15px 15px}
#custom_background span{-moz-transition:all .2s ease-in-out 0;background:none no-repeat scroll 50% 50% #000;border-radius:7px 7px 7px 7px;box-shadow:0 1px 7px #000 inset, 0 1px 0 rgba(255,255,255,0.05), 0 0 1px rgba(255,255,255,0.35);cursor:pointer;display:block;float:left;height:90px;margin-right:15px;width:140px}
#custom_background span:hover{box-shadow:0 1px 2px #000 inset, 0 1px 0 rgba(255,255,255,0.05), 0 0 1px rgba(255,255,255,0.35)}
#bg1{background-attachment:fixed; background-size: 100%; background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/zerg11.jpg)!important;background-repeat:repeat-x!important}
#bg6{background-attachment:fixed; background-size: 100%; background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/1jimra10.png)!important;background-repeat:repeat-x!important}
#bg5{background-attachment:fixed; background-size: 100%; background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/1tychu10.png)!important}
#bg2{background-attachment:fixed; background-size: 100%; background-image:url(http://i1359.photobucket.com/albums/q800/azure91/Forum/protoss_zpsc0553b1f.jpg)!important}
#bg3{background-attachment:fixed; background-size: 100%; background-image:url(http://i1359.photobucket.com/albums/q800/azure91/Forum/fundo_zps7e8c3ea7.jpg)!important}
#bg4{background-attachment:fixed; background-size: 100%; background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/1kerri10.png)!important}
#custom_url{clear:left;padding-top:10px;text-align:center}
#custom_input{background:none repeat scroll 0 0 rgba(0,0,0,0.5);border:0 none;border-radius:4px 4px 4px 4px;box-shadow:0 1px 3px rgba(0,0,0,0.75) inset, 0 1px 0 rgba(255,255,255,0.15);color:#FFF;font-size:20px;height:40px;margin-left:-15px;margin-right:8px;white-space:nowrap;width:780px;padding:0 10px 0 0}
#custom_submit{background:url(http://i48.servimg.com/u/f48/16/58/89/73/highli10.png) repeat-x scroll 0 0 rgba(197,206,213,0.4);border-radius:4px 4px 4px 4px;box-shadow:0 1px 3px rgba(0,0,0,0.6);color:#FFF;cursor:pointer;display:inline-block;font-size:20px;font-weight:400;line-height:40px;text-shadow:0 -1px 0 #4C5057;padding:0 10px}
.bg1{background-attachment:fixed; background-size: 100%; background:url(http://i72.servimg.com/u/f72/17/41/76/40/zerg11.jpg) repeat fixed 50% 0 #000!important}
.bg2{background-attachment:fixed; background-size: 100%; background:url(http://i1359.photobucket.com/albums/q800/azure91/Forum/protoss_zpsc0553b1f.jpg) repeat fixed 50% 0 #000!important}
.bg3{background-attachment:fixed; background-size: 100%; background:url(http://i1359.photobucket.com/albums/q800/azure91/Forum/fundo_zps7e8c3ea7.jpg) repeat fixed 50% 0 #000!important}
.bg4{background-attachment:fixed; background-size: 100%; background:url(http://i72.servimg.com/u/f72/17/41/76/40/kerrig12.jpg) repeat fixed 50% 0 #000!important}
.bg5{background-attachment:fixed; background-size: 100%; background:url(http://i72.servimg.com/u/f72/17/41/76/40/tychus11.jpg) fixed 100% 0 #0E1E2D!important}
.bg6{background-attachment:fixed; background-size: 100%; background:url(http://i72.servimg.com/u/f72/17/41/76/40/jim_ra10.jpg) repeat fixed 50% 0 #000!important}
.bg_custom{background-attachment:fixed; background-size: 100%; background-attachment:fixed;background-color:#000;background-repeat:repeat}
#nav_background{background-color:#000;border:3px dotted #444!important;border-radius:15px 15px 15px 15px;cursor:pointer;float:right;padding:5px}
#nav_background:hover{background-color:#FFF}
#nav_background:active{background-color:#E71E7B}
/* Styles Forum */
.postfoot {
clear: both;
margin-left: -17em;
-top: 1px #ccc;
background: rgba(255, 255, 255, .2);
background-repeat: repeat-x;
padding: 0.5em 1em;
text-align: right;
border-top: 1px solid #ffffff;
}
.pun .posthead {
background: rgba(255, 255, 255, .2);
border-bottom: 1px solid #ccc;
}
.pathname-box p{display:none!important}
#pun-navlinks li a:hover {color: white;
text-decoration: none!important;}
#pun-navlinks ul {
list-style: none;
text-align: left;
width: 980px;
margin: auto;
}
#stats {
margin: 0 auto !important;
text-align: center !important;
display: table;
background: none;
}
.statHide{display:none !important;}
.statsPers li span a {
text-decoration: none !important;
}
.statsPers li > span {
padding: 5px 8px;
background: #E1E1E1;
box-shadow: inset rgba(0, 0, 0, 0.3) 0px 1px 2px, rgba(255, 255, 255, 1) 0px 1px 0px;
-moz-box-shadow: inset rgba(0, 0, 0, 0.3) 0px 1px 2px, rgba(255, 255, 255, 1) 0px 1px 0px;
-webkit-box-shadow: inset rgba(0, 0, 0, 0.3) 0px 1px 2px, rgba(255, 255, 255, 1) 0px 1px 0px;
-o-box-shadow: inset rgba(0, 0, 0, 0.3) 0px 1px 2px, rgba(255, 255, 255, 1) 0px 1px 0px;
border: 1px solid #E1E1E1;
margin-bottom: 10px;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
-o-border-radius: 3px;
text-shadow: 1px 1px 0 white;
color: #111;
font-weight: 700;
}
.statsPers li {
float: left;
color:#666;
margin: 2px 10px;
}
.statsPers {
list-style: none;
display: block;
margin: 0px auto;
width: 100%;
}
* {
margin: 0;
padding: 0;
}
.pun {
width: 990px;
margin: 0 auto;
}
#pun-navlinks {
display: none;
}
#page-body {
background: rgba(255, 255, 255, .1);
width: 970px;
padding: 10px;
-moz-border-radius: 4px;
-webkit-border-radius:4px;
border-radius: 4px;
margin-top: 10px;
border: 1px solid #252c36;
overflow: hidden;
}
#controlbar {
background: url('') no-repeat;
background: rgba(255, 255, 255, .3);
width: 960px;
height: 50px;
clear: both;
padding: 0 10px;
line-height: 50px;
margin-bottom: 10px;
}
ul#nav {
height: 50px;
}
ul#nav li.menuitem {
float: left;
margin-right: 15px;
list-style: none;
margin-top: none;
margin-bottom: none;
}
ul#nav li a {
font-size: 13px;
font-weight: bold;
padding-left: 20px;
}
ul#nav li.home {
background: url('http://i1359.photobucket.com/albums/q800/azure91/Forum/home10_zps5e53ab7e.png') no-repeat left center;
}
ul#nav li.users {
background: url('http://i1359.photobucket.com/albums/q800/azure91/Forum/users10_zps5085b394.png') no-repeat left center;
}
ul#nav li.search {
background: url('http://i1359.photobucket.com/albums/q800/azure91/Forum/search10_zps068ff1ba.png') no-repeat left center;
}
ul#nav li.logout {
background: url('http://i1359.photobucket.com/albums/q800/azure91/Forum/icon-l10_zpsbfa6e02b.png') no-repeat left center;
float: right;
}
ul#nav li.profile{
background: url('http://i1359.photobucket.com/albums/q800/azure91/Forum/ucp10_zps0b1b9e0e.png') no-repeat left center;
}
ul#nav li.inbox {
background: url('http://i1359.photobucket.com/albums/q800/azure91/Forum/icon-p10_zps8a9602fe.png') no-repeat left center;
}
ul#nav li.register {
background: url('http://i1359.photobucket.com/albums/q800/azure91/Forum/icon-r10_zps5541e9a8.png') no-repeat left center;
}
ul#nav li.login {
background: url('http://i1359.photobucket.com/albums/q800/azure91/Forum/icon-l10_zpsbfa6e02b.png') no-repeat left center;
}
#user_info {
width: 320px;
height: 120px;
border: 1px solid #bcd8e6;
border-bottom: 3px solid #bcd8e6;
padding: 10px;
background: url('http://i41.servimg.com/u/f41/16/01/61/63/topgra10.gif') repeat-x ;
background: rgba(255, 255, 255, .1);
}
#user_wrap {
margin-top: 23px;
}
.fl { float: left; }
#pun-visit {
display: none;
}
#pndcwidget {
background: url('http://i43.servimg.com/u/f43/16/93/80/74/sideba10.png') no-repeat;
position: fixed;
left: 0;
margin-top: 150px;
height: 82px;
width: 23px;
display: block !important;
z-index: 999;
}
.widget-button {
display: block;
height: 16px;
margin-bottom: 8px;
margin-left: 3px;
}
#user_avatar img {
width: 75px;
height: 85px;
padding-right: 10px;
margin-top: 20px;
}
#user_name {
font-weight: bold;
}
.main-head {
margin-top: 10px;
-moz-border-radius: 3px 3px 0 0;
-webkit-border-radius: 3px 3px 0 0;
border-radius: 3px 3px 0 0;
}
.user-info {
margin-bottom: 5px;
}
#user_info ul li {
list-style: none;
padding-left: 10px;
}
.pun table td.tcl {
height: 60px;
min-height: 60px;
max-height: 60px;
}
.pun table td.tcl {
vertical-align: middle !important;
}
.pun table.table td {
padding-bottom: 0px !important;
}
.pun table .tcl{
width: 70% !important;
}
.tc2 {
border-left: none !important;
border-right: none !important;
}
.tc3 {
border-left: none !important;
}
.status {
margin-top: 5px;
}
.pun table.table td {
padding-top: 0em !important;
}
.main .main-foot, .main .main-head {
background: url('');
background: rgba(255, 255, 255, .3);
height: 35px;
border: 1px solid #fff;
padding: 0px !important;
line-height: 30px;
}
.postbit {
background: url('http://i43.servimg.com/u/f43/16/93/80/74/postbi10.png') no-repeat;
width: 74px;
height: 38px;
padding-top: 3px;
}
.user-info span {
color: #000000;
font-size: 11px;
}
.post_field {
background: rgba(255, 255, 255, .1);
color:#4d5153;
border:1px solid #d6dee1;
padding:3px 3px 3px 10px;
margin-top: 2px;
text-align:left;
}
.pun .paged-foot, .pun .paged-head { border: none; background: none; }
.pun .paged .posting {
margin-right: -15px;
}
.vote {
float: right;
width: 16px;
margin-left: 4px;
}
.codebox {
width: 95%;
}
.frm-info {
border: none;
background: rgba(255, 255, 255, .3);
padding-left: 30px !important;
}
#pun-intro {
background: none;
border: none;
}
.pun table .tdtopics .status {
margin-top: -1px;
}
#pun-about{ text-align: center;
border: none;}
#pun-about ul li a {
color: #fff;
text-decoration: none!important;
text-align: center;
border: none;
}
#ol_time {
float: right;
background: #F4F4F4;
border: 1px solid #ddd;
border-radius: 0 0 3px 3px;
padding: 5px 10px;
border-top: none;
margin-top: -12px;
}
#tabs {
margin-left: -20px;
}
.options { display:none; }
.user-info img {vertical-align: middle; }
/* Color Picker Styles */
#color, #wcolor {overflow: visible;}
#colorpicker {position: absolute; top: 20px; left: -225px;}
#grid {border: 1px solid #808080;}
#grid td {padding: 0px;}
#grid td button {height: 12px; width: 12px; padding: 0px; border: 1px solid #808080;}
#grid td button:hover {border: 1px solid #ffffff;
}
/*Tipsy Styles*/
.tipsy { padding: 5px; font-size: 10px; opacity: 0.8; filter: alpha(opacity=80); background-repeat: no-repeat; background-image: url('http://i43.servimg.com/u/f43/16/93/80/74/tipsy10.gif'); }
.tipsy-inner { padding: 5px 8px 4px 8px; background-color: black; color: white; max-width: 200px; text-align: center; }
.tipsy-inner { -moz-border-radius:3px; -webkit-border-radius:3px; }
.tipsy-north { background-position: top center; }
.tipsy-south { background-position: bottom center; }
.tipsy-east { background-position: right center; }
.tipsy-west { background-position: left center; }
/* Username Styles */
.pun .user-ident .username a[href="/u1"], #onlinelist [href="/u1"], .statused a[href="/u1"], #stats [href="/u1"], #chatbox_members a[href="/u1"], #chatbox a[href="/u1"], #onlinechat a[href="/u1"], #profile-advanced-right div.h3 strong, .module a[href="/u1"] {
background: url('http://i43.servimg.com/u/f43/16/93/80/74/09211.png') no-repeat left center !important;
padding-left: 14px;
height: 16px;
}
.pun .user-ident .username a[href="/u3"], #onlinelist [href="/u3"], .statused a[href="/u3"], #stats [href="/u3"], #chatbox_members a[href="/u3"], #chatbox a[href="/u3"], #onlinechat a[href="/u3"], #profile-advanced-right div.h3 strong, .module a[href="/u3"] {
background: url('http://i43.servimg.com/u/f43/16/93/80/74/08811.png') no-repeat left center !important;
padding-left: 14px;
height: 16px;
}
.pun .user-ident .username a[href="/u5"], #onlinelist [href="/u5"], .statused a[href="/u5"], #stats [href="/u5"], #chatbox_members a[href="/u5"], #chatbox a[href="/u5"], #onlinechat a[href="/u5"], #profile-advanced-right div.h3 strong, .module a[href="/u5"] {
background: url('http://i49.servimg.com/u/f49/15/99/90/75/08510.png') no-repeat left center !important;
padding-left: 14px;
height: 16px;
}
.pun .user-ident .username a[href="/u6"], #onlinelist [href="/u6"], .statused a[href="/u6"], #stats [href="/u6"], #chatbox_members a[href="/u6"], #chatbox a[href="/u6"], #onlinechat a[href="/u6"], #profile-advanced-right div.h3 strong, .module a[href="/u6"] {
background: url('http://i43.servimg.com/u/f43/16/93/80/74/09011.png') no-repeat left center !important;
padding-left: 14px;
height: 16px;
}
/* Notification Styles */
div.jGrowl {
z-index: 999;
color: #fff;
font-size: 12px;
}
/** Special IE6 Style Positioning **/
div.ie6 {
position: absolute;
}
div.ie6.top-right {
right: auto;
bottom: auto;
left: expression( ( 0 - jGrowl.offsetWidth + ( document.documentElement.clientWidth ? document.documentElement.clientWidth : document.body.clientWidth ) + ( ignoreMe2 = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft ) ) + 'px' );
top: expression( ( 0 + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ) ) + 'px' );
}
div.ie6.top-left {
left: expression( ( 0 + ( ignoreMe2 = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft ) ) + 'px' );
top: expression( ( 0 + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ) ) + 'px' );
}
div.ie6.bottom-right {
left: expression( ( 0 - jGrowl.offsetWidth + ( document.documentElement.clientWidth ? document.documentElement.clientWidth : document.body.clientWidth ) + ( ignoreMe2 = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft ) ) + 'px' );
top: expression( ( 0 - jGrowl.offsetHeight + ( document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight ) + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ) ) + 'px' );
}
div.ie6.bottom-left {
left: expression( ( 0 + ( ignoreMe2 = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft ) ) + 'px' );
top: expression( ( 0 - jGrowl.offsetHeight + ( document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight ) + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ) ) + 'px' );
}
div.ie6.center {
left: expression( ( 0 + ( ignoreMe2 = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft ) ) + 'px' );
top: expression( ( 0 + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ) ) + 'px' );
width: 100%;
}
/** Normal Style Positions **/
div.jGrowl {
position: absolute;
}
body > div.jGrowl {
position: fixed;
}
div.jGrowl.top-left {
left: 0px;
top: 0px;
}
div.jGrowl.top-right {
right: 0px;
top: 0px;
}
div.jGrowl.bottom-left {
left: 0px;
bottom: 0px;
}
div.jGrowl.bottom-right {
right: 0px;
bottom: 0px;
}
div.jGrowl.center {
top: 0px;
width: 50%;
left: 25%;
}
/** Cross Browser Styling **/
div.center div.jGrowl-notification, div.center div.jGrowl-closer {
margin-left: auto;
margin-right: auto;
}
div.jGrowl div.jGrowl-notification, div.jGrowl div.jGrowl-closer {
background-color: #000;
opacity: .85;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)";
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=85);
zoom: 1;
width: 235px;
padding: 10px;
margin-top: 5px;
margin-bottom: 5px;
font-family: Tahoma, Arial, Helvetica, sans-serif;
font-size: 1em;
text-align: left;
display: none;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}
div.jGrowl div.jGrowl-notification {
min-height: 40px;
}
div.jGrowl div.jGrowl-notification,
div.jGrowl div.jGrowl-closer {
margin: 10px;
}
div.jGrowl div.jGrowl-notification div.jGrowl-header {
font-weight: bold;
font-size: .85em;
}
div.jGrowl div.jGrowl-notification div.jGrowl-close {
z-index: 99;
float: right;
font-weight: bold;
font-size: 1em;
cursor: pointer;
}
div.jGrowl div.jGrowl-closer {
padding-top: 4px;
padding-bottom: 4px;
cursor: pointer;
font-size: .9em;
font-weight: bold;
text-align: center;
}
/** Hide jGrowl when printing **/
@media print {
div.jGrowl {
display: none;
}
}
.fade {
display:inline-block;
background: -moz-linear-gradient(left, rgb(255,255,225) 0%, rgba(255,255,225,0) 100%);
background-image: -webkit-gradient(linear, left top, right top, color-stop(0.00, rgb(255,255,225)), color-stop(1.00, rgba(255,255,225,0)));
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffe1, endColorstr=#00ffffe1, GradientType=1);
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffe1, endColorstr=#00ffffe1, GradientType=1)";
}
.blur {
display:inline-block;
color:#ddd;
text-shadow: 0 0 2px #aaaaaa;
text-shadow: 0 0 4px #aaaaaa;
text-shadow: 0 0 6px #aaaaaa;
-ms-filter: "progid:DXImageTransform.Microsoft.Blur(pixelradius=2)";
filter:
progid:DXImageTransform.Microsoft.MotionBlur(strength=1,direction=310)
progid:DXImageTransform.Microsoft.Blur(pixelradius=2);
}
.flipH {
display:inline-block;
-moz-transform:scale(-1,1);
-o-transform:scale(-1,1);
-webkit-transform:scale(-1,1);
transform:scale(-1,1);
-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=-1, M12=0, M21=0, M22=1, SizingMethod='auto expand')";
filter: progid:DXImageTransform.Microsoft.Matrix(
M11=-1,
M12=0,
M21=0,
M22=1,
SizingMethod="auto expand");
}
.flipV {
display:inline-block;
-moz-transform:scale(1,-1);
-o-transform:scale(1,-1);
-webkit-transform:scale(1,-1);
transform:scale(1,-1);
-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1, M12=0, M21=0, M22=-1, SizingMethod='auto expand')";
filter: progid:DXImageTransform.Microsoft.Matrix(
M11=1,
M12=0,
M21=0,
M22=-1,
SizingMethod="auto expand");
}
Testei no meu fórum de testes e funcionou: http://templatesqueen.forumais.com/forum
Cordialmente,
The Boss
Re: Background diferente para cada membro
Eu quero esse código coloque o background 100% da pagina indiferente da resolução do monitor ou do zoom que o usuário tiver exemplo"
As imagens abaixo descreve melhor o que eu quero
Site de teste seu:
Pelo que voce pode perceber se alterar a resolução ou se eu alterar o zoom da tela a imagem fica cortada ou ela se repete ate completar toda a tela (eu não quero que ela faça isso) agora vamos utilizar um site que tem o efeito que eu quero!
Site:
Como voce pode visualizar na segunda imagem não importa que resolução eu utilize o background não se altera ele não se repete!!
esse efeito está nesse site como dito anteriormente
http://odisseia.forumais.com/
As imagens abaixo descreve melhor o que eu quero
Site de teste seu:
Pelo que voce pode perceber se alterar a resolução ou se eu alterar o zoom da tela a imagem fica cortada ou ela se repete ate completar toda a tela (eu não quero que ela faça isso) agora vamos utilizar um site que tem o efeito que eu quero!
Site:
Como voce pode visualizar na segunda imagem não importa que resolução eu utilize o background não se altera ele não se repete!!
esse efeito está nesse site como dito anteriormente
http://odisseia.forumais.com/
Re: Background diferente para cada membro
Bom dia,
Eu editei o código desta maneira como pediu, no entanto ele não funcionou, eu coloquei nas balizas relativas aos backgrounds que já estão no código, mas por algum motivo as propriedades são ignoradas.
Contudo se você for testar colocando uma URL externa como background verá que funciona, já tentei de vários modos diferentes e não deu resultado, vou pedir para algum outro staff tentar ajudá-lo em sua dúvida.
Cordialmente,
The Boss
Eu editei o código desta maneira como pediu, no entanto ele não funcionou, eu coloquei nas balizas relativas aos backgrounds que já estão no código, mas por algum motivo as propriedades são ignoradas.
Contudo se você for testar colocando uma URL externa como background verá que funciona, já tentei de vários modos diferentes e não deu resultado, vou pedir para algum outro staff tentar ajudá-lo em sua dúvida.
Cordialmente,
The Boss
Re: Background diferente para cada membro
Ok vou aguardar algum outro membro da staff me ajudar nesse problema!
Re: Background diferente para cada membro
Olá, seu problemas acabaram! Substitua o CSS por este:
Até mais.
- Código:
#custom_background{background-size: 100%;filter:alpha(opacity=93);-moz-opacity:0.93;opacity:0.93; background-attachment:fixed;background-color:#361010; background-image:url('http://i31.servimg.com/u/f31/17/41/76/40/backgr21.jpg') !important;box-shadow:0 0 10px rgba(0,0,0,0.8) inset;color:#FFF;position:relative;padding:15px 0 15px 15px}
#custom_background span{-moz-transition:all .2s ease-in-out 0;background:none no-repeat scroll 50% 50% #000;border-radius:7px 7px 7px 7px;box-shadow:0 1px 7px #000 inset, 0 1px 0 rgba(255,255,255,0.05), 0 0 1px rgba(255,255,255,0.35);cursor:pointer;display:block;float:left;height:90px;margin-right:15px;width:140px}
#custom_background span:hover{box-shadow:0 1px 2px #000 inset, 0 1px 0 rgba(255,255,255,0.05), 0 0 1px rgba(255,255,255,0.35)}
#bg1{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/zerg11.jpg)!important;background-repeat:repeat-x!important}
#bg6{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/1jimra10.png)!important;background-repeat:repeat-x!important}
#bg5{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/1tychu10.png)!important}
#bg2{background-image:url(http://i1359.photobucket.com/albums/q800/azure91/Forum/protoss_zpsc0553b1f.jpg)!important}
#bg3{background-image:url(http://i1359.photobucket.com/albums/q800/azure91/Forum/fundo_zps7e8c3ea7.jpg)!important}
#bg4{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/1kerri10.png)!important}
#custom_url{clear:left;padding-top:10px;text-align:center}
#custom_input{background:none repeat scroll 0 0 rgba(0,0,0,0.5);border:0 none;border-radius:4px 4px 4px 4px;box-shadow:0 1px 3px rgba(0,0,0,0.75) inset, 0 1px 0 rgba(255,255,255,0.15);color:#FFF;font-size:20px;height:40px;margin-left:-15px;margin-right:8px;white-space:nowrap;width:780px;padding:0 10px 0 0}
#custom_submit{background:url(http://i48.servimg.com/u/f48/16/58/89/73/highli10.png) repeat-x scroll 0 0 rgba(197,206,213,0.4);border-radius:4px 4px 4px 4px;box-shadow:0 1px 3px rgba(0,0,0,0.6);color:#FFF;cursor:pointer;display:inline-block;font-size:20px;font-weight:400;line-height:40px;text-shadow:0 -1px 0 #4C5057;padding:0 10px}
.bg1{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/zerg11.jpg) !important}
.bg2{background-image:url(http://i1359.photobucket.com/albums/q800/azure91/Forum/protoss_zpsc0553b1f.jpg)!important}
.bg3{background-image:url(http://i1359.photobucket.com/albums/q800/azure91/Forum/fundo_zps7e8c3ea7.jpg)!important}
.bg4{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/kerrig12.jpg)!important}
.bg5{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/tychus11.jpg)!important}
.bg6{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/jim_ra10.jpg)!important}
.bg_custom{background-attachment:fixed;background-color:#000;background-repeat:repeat}
#nav_background{background-color:#000;border:3px dotted #444!important;border-radius:15px 15px 15px 15px;cursor:pointer;float:right;padding:5px}
#nav_background:hover{background-color:#FFF}
#nav_background:active{background-color:#E71E7B}
Até mais.
Re: Background diferente para cada membro
Bom dia,
Conversei com o BrunoH. e as alterações no CSS estão corretas, provavelmente há algo no jquery desse código que está impedindo o redimensionamento dos backgrounds que já vêm no mesmo.
Tentamos de vários modos diferentes e ainda sim, apenas o background via URL se adapta à janela, os outros não.
Cordialmente,
The Boss
Conversei com o BrunoH. e as alterações no CSS estão corretas, provavelmente há algo no jquery desse código que está impedindo o redimensionamento dos backgrounds que já vêm no mesmo.
Tentamos de vários modos diferentes e ainda sim, apenas o background via URL se adapta à janela, os outros não.
Cordialmente,
The Boss
Re: Background diferente para cada membro
Olá!
Presciso que o Sr. ative o código e passe o link do fórum onde o mesmo estiver ativado.
Até mais.
Presciso que o Sr. ative o código e passe o link do fórum onde o mesmo estiver ativado.
Até mais.
Re: Background diferente para cada membro
Olá!
Vamos resumir essa situação, está se alongada em muitos posts desnecessários.
Se o código não funciona em seu fórum, pode ser por conflito com outros códigos, passe o código js que está utilizando em seu fórum.
Melhores cumprimentos,
seender
Vamos resumir essa situação, está se alongada em muitos posts desnecessários.
Se o código não funciona em seu fórum, pode ser por conflito com outros códigos, passe o código js que está utilizando em seu fórum.
Melhores cumprimentos,
seender
Re: Background diferente para cada membro
Eu só tenho esse código ativo no meu fórum de teste!
java
css:
fórum de teste
http://v2-0.forumeiros.com/
java
- Código:
jQuery(function () {
jQuery("body").prepend('<img src="http://i31.servimg.com/u/f31/17/41/76/40/nav_ba10.png" alt="Change background image" title="Trocar a imagem de fundo" id="nav_background" />');
jQuery("body").prepend('<div id="toggle_background" style="display: none;"><div id="custom_background"><span id="bg1"></span><span id="bg6"></span><span id="bg5"></span><span id="bg2"></span><span id="bg3"></span><span id="bg4"></span><div id="custom_url"><input type="text" placeholder=" Endereço de outra imagem" id="custom_input"><strong id="custom_submit">Aplicar</strong></div></div></div>');
jQuery("#custom_background span").click(function () {
jQuery("body").removeClass("bg1 bg2 bg3 bg4 bg5 bg6 bg_custom").addClass(jQuery(this).attr("id"));
my_setcookie("custom_background", jQuery(this).attr("id"), true);
});
jQuery("#custom_submit").click(function () {
var urlbg = jQuery("#custom_input").val();
jQuery("body").removeClass("bg1 bg2 bg3 bg4 bg5 bg6 bg_custom").addClass("bg_custom").css("background-image", "url('" + urlbg + "')");
my_setcookie("custom_background", urlbg, true);
});
jQuery("#nav_background").click(function () {
jQuery("#toggle_background").slideToggle()
});
if (my_getcookie("custom_background") != "") {
if (my_getcookie("custom_background").length > 4) {
jQuery("body").addClass("bg_custom").css("background-image", "url(" + my_getcookie("custom_background") + ")");
} else {
jQuery("body").addClass(my_getcookie("custom_background"))
}
}
});
css:
- Código:
#custom_background{background-size: 100%;filter:alpha(opacity=93);-moz-opacity:0.93;opacity:0.93; background-attachment:fixed;background-color:#361010; background-image:url('http://i31.servimg.com/u/f31/17/41/76/40/backgr21.jpg') !important;box-shadow:0 0 10px rgba(0,0,0,0.8) inset;color:#FFF;position:relative;padding:15px 0 15px 15px}
#custom_background span{-moz-transition:all .2s ease-in-out 0;background:none no-repeat scroll 50% 50% #000;border-radius:7px 7px 7px 7px;box-shadow:0 1px 7px #000 inset, 0 1px 0 rgba(255,255,255,0.05), 0 0 1px rgba(255,255,255,0.35);cursor:pointer;display:block;float:left;height:90px;margin-right:15px;width:140px}
#custom_background span:hover{box-shadow:0 1px 2px #000 inset, 0 1px 0 rgba(255,255,255,0.05), 0 0 1px rgba(255,255,255,0.35)}
#bg1{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/zerg11.jpg)!important;background-repeat:repeat-x!important}
#bg6{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/1jimra10.png)!important;background-repeat:repeat-x!important}
#bg5{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/1tychu10.png)!important}
#bg2{background-image:url(http://i1359.photobucket.com/albums/q800/azure91/Forum/protoss_zpsc0553b1f.jpg)!important}
#bg3{background-image:url(http://i1359.photobucket.com/albums/q800/azure91/Forum/fundo_zps7e8c3ea7.jpg)!important}
#bg4{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/1kerri10.png)!important}
#custom_url{clear:left;padding-top:10px;text-align:center}
#custom_input{background:none repeat scroll 0 0 rgba(0,0,0,0.5);border:0 none;border-radius:4px 4px 4px 4px;box-shadow:0 1px 3px rgba(0,0,0,0.75) inset, 0 1px 0 rgba(255,255,255,0.15);color:#FFF;font-size:20px;height:40px;margin-left:-15px;margin-right:8px;white-space:nowrap;width:780px;padding:0 10px 0 0}
#custom_submit{background:url(http://i48.servimg.com/u/f48/16/58/89/73/highli10.png) repeat-x scroll 0 0 rgba(197,206,213,0.4);border-radius:4px 4px 4px 4px;box-shadow:0 1px 3px rgba(0,0,0,0.6);color:#FFF;cursor:pointer;display:inline-block;font-size:20px;font-weight:400;line-height:40px;text-shadow:0 -1px 0 #4C5057;padding:0 10px}
.bg1{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/zerg11.jpg) !important}
.bg2{background-image:url(http://i1359.photobucket.com/albums/q800/azure91/Forum/protoss_zpsc0553b1f.jpg)!important}
.bg3{background-image:url(http://i1359.photobucket.com/albums/q800/azure91/Forum/fundo_zps7e8c3ea7.jpg)!important}
.bg4{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/kerrig12.jpg)!important}
.bg5{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/tychus11.jpg)!important}
.bg6{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/jim_ra10.jpg)!important}
.bg_custom{background-attachment:fixed;background-color:#000;background-repeat:repeat}
#nav_background{background-color:#000;border:3px dotted #444!important;border-radius:15px 15px 15px 15px;cursor:pointer;float:right;padding:5px}
#nav_background:hover{background-color:#FFF}
#nav_background:active{background-color:#E71E7B}
fórum de teste
http://v2-0.forumeiros.com/
Re: Background diferente para cada membro
Olá!
Olhe aqui no fórum de testes: http://temasbr.forumeiros.com/
Funciona perfeitamente o código!
Melhores cumprimentos,
seender
Olhe aqui no fórum de testes: http://temasbr.forumeiros.com/
Funciona perfeitamente o código!
Melhores cumprimentos,
seender
Re: Background diferente para cada membro
Eu quero esse código coloque o background 100% da pagina indiferente da resolução do monitor ou do zoom que o usuário tiver exemplo"
As imagens abaixo descreve melhor o que eu quero
Site de teste seu:
Pelo que voce pode perceber se alterar a resolução ou se eu alterar o zoom da tela a imagem fica cortada ou ela se repete ate completar toda a tela (eu não quero que ela faça isso) agora vamos utilizar um site que tem o efeito que eu quero!
Site:
Como voce pode visualizar na segunda imagem não importa que resolução eu utilize o background não se altera ele não se repete!!
esse efeito está nesse site como dito anteriormente
http://odisseia.forumais.com/
As imagens abaixo descreve melhor o que eu quero
Site de teste seu:
Pelo que voce pode perceber se alterar a resolução ou se eu alterar o zoom da tela a imagem fica cortada ou ela se repete ate completar toda a tela (eu não quero que ela faça isso) agora vamos utilizar um site que tem o efeito que eu quero!
Site:
Como voce pode visualizar na segunda imagem não importa que resolução eu utilize o background não se altera ele não se repete!!
esse efeito está nesse site como dito anteriormente
http://odisseia.forumais.com/
Re: Background diferente para cada membro
Olá!
Troque o css por este:
Troque o css por este:
- Código:
#custom_background{background-size: 100%;filter:alpha(opacity=93);-moz-opacity:0.93;opacity:0.93; background-attachment:fixed;background-color:#361010; background-image:url('http://i31.servimg.com/u/f31/17/41/76/40/backgr21.jpg') !important;box-shadow:0 0 10px rgba(0,0,0,0.8) inset;color:#FFF;position:relative;padding:15px 0 15px 15px}
#custom_background span{-moz-transition:all .2s ease-in-out 0;background:none no-repeat scroll 50% 50% #000;border-radius:7px 7px 7px 7px;box-shadow:0 1px 7px #000 inset, 0 1px 0 rgba(255,255,255,0.05), 0 0 1px rgba(255,255,255,0.35);cursor:pointer;display:block;float:left;height:90px;margin-right:15px;width:140px}
#custom_background span:hover{box-shadow:0 1px 2px #000 inset, 0 1px 0 rgba(255,255,255,0.05), 0 0 1px rgba(255,255,255,0.35)}
#bg1{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/zerg11.jpg)!important;background-attachment:scroll;background-repeat:no-repeat!important}
#bg6{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/1jimra10.png)!important;background-repeat:no-repeat!important}
#bg5{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/1tychu10.png)!important}
#bg2{background-image:url(http://i1359.photobucket.com/albums/q800/azure91/Forum/protoss_zpsc0553b1f.jpg)!important}
#bg3{background-image:url(http://i1359.photobucket.com/albums/q800/azure91/Forum/fundo_zps7e8c3ea7.jpg)!important}
#bg4{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/1kerri10.png)!important}
#custom_url{clear:left;padding-top:10px;text-align:center}
#custom_input{background:none repeat scroll 0 0 rgba(0,0,0,0.5);border:0 none;border-radius:4px 4px 4px 4px;box-shadow:0 1px 3px rgba(0,0,0,0.75) inset, 0 1px 0 rgba(255,255,255,0.15);color:#FFF;font-size:20px;height:40px;margin-left:-15px;margin-right:8px;white-space:nowrap;width:780px;padding:0 10px 0 0}
#custom_submit{background:url(http://i48.servimg.com/u/f48/16/58/89/73/highli10.png) repeat-x scroll 0 0 rgba(197,206,213,0.4);border-radius:4px 4px 4px 4px;box-shadow:0 1px 3px rgba(0,0,0,0.6);color:#FFF;cursor:pointer;display:inline-block;font-size:20px;font-weight:400;line-height:40px;text-shadow:0 -1px 0 #4C5057;padding:0 10px}
.bg1{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/zerg11.jpg) !important}
.bg2{background-image:url(http://i1359.photobucket.com/albums/q800/azure91/Forum/protoss_zpsc0553b1f.jpg)!important}
.bg3{background-image:url(http://i1359.photobucket.com/albums/q800/azure91/Forum/fundo_zps7e8c3ea7.jpg)!important}
.bg4{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/kerrig12.jpg)!important}
.bg5{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/tychus11.jpg)!important}
.bg6{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/jim_ra10.jpg)!important}
.bg_custom{background-attachment:scroll;background-color:#000;background-repeat:no-repeat;}
#nav_background{background-color:#000;border:3px dotted #444!important;border-radius:15px 15px 15px 15px;cursor:pointer;float:right;padding:5px}
#nav_background:hover{background-color:#FFF}
#nav_background:active{background-color:#E71E7B}
Re: Background diferente para cada membro
Sem resultado o problema persiste!
efetuei o teste nesse fórum e ele não possui nenhum outro código ativo
http://v2-0.forumeiros.com/
efetuei o teste nesse fórum e ele não possui nenhum outro código ativo
http://v2-0.forumeiros.com/
Re: Background diferente para cada membro
Olá!
Troque por este:
Até mais!
Troque por este:
- Código:
#custom_background{background-size: 100%;filter:alpha(opacity=93);-moz-opacity:0.93;opacity:0.93; background-attachment:fixed;background-color:#361010; background-image:url('http://i31.servimg.com/u/f31/17/41/76/40/backgr21.jpg') !important;box-shadow:0 0 10px rgba(0,0,0,0.8) inset;color:#FFF;position:relative;padding:15px 0 15px 15px}
#custom_background span{-moz-transition:all .2s ease-in-out 0;background:none no-repeat fixed 50% 50% #000;border-radius:7px 7px 7px 7px;box-shadow:0 1px 7px #000 inset, 0 1px 0 rgba(255,255,255,0.05), 0 0 1px rgba(255,255,255,0.35);cursor:pointer;display:block;float:left;height:90px;margin-right:15px;width:140px}
#custom_background span:hover{box-shadow:0 1px 2px #000 inset, 0 1px 0 rgba(255,255,255,0.05), 0 0 1px rgba(255,255,255,0.35)}
#bg1{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/zerg11.jpg)!important;background-attachment:fixed;background-repeat:no-repeat!important}
#bg6{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/1jimra10.png)!important;background-repeat:no-repeat!important}
#bg5{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/1tychu10.png)!important}
#bg2{background-image:url(http://i1359.photobucket.com/albums/q800/azure91/Forum/protoss_zpsc0553b1f.jpg)!important}
#bg3{background-image:url(http://i1359.photobucket.com/albums/q800/azure91/Forum/fundo_zps7e8c3ea7.jpg)!important}
#bg4{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/1kerri10.png)!important}
#custom_url{clear:left;padding-top:10px;text-align:center}
#custom_input{background:none repeat fixed 0 0 rgba(0,0,0,0.5);border:0 none;border-radius:4px 4px 4px 4px;box-shadow:0 1px 3px rgba(0,0,0,0.75) inset, 0 1px 0 rgba(255,255,255,0.15);color:#FFF;font-size:20px;height:40px;margin-left:-15px;margin-right:8px;white-space:nowrap;width:780px;padding:0 10px 0 0}
#custom_submit{background:url(http://i48.servimg.com/u/f48/16/58/89/73/highli10.png) repeat-x fixed 0 0 rgba(197,206,213,0.4);border-radius:4px 4px 4px 4px;box-shadow:0 1px 3px rgba(0,0,0,0.6);color:#FFF;cursor:pointer;display:inline-block;font-size:20px;font-weight:400;line-height:40px;text-shadow:0 -1px 0 #4C5057;padding:0 10px}
.bg1{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/zerg11.jpg) !important}
.bg2{background-image:url(http://i1359.photobucket.com/albums/q800/azure91/Forum/protoss_zpsc0553b1f.jpg)!important}
.bg3{background-image:url(http://i1359.photobucket.com/albums/q800/azure91/Forum/fundo_zps7e8c3ea7.jpg)!important}
.bg4{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/kerrig12.jpg)!important}
.bg5{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/tychus11.jpg)!important}
.bg6{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/jim_ra10.jpg)!important}
.bg_custom{background-attachment:fixed;background-color:#000;background-repeat:no-repeat;}
#nav_background{background-color:#000;border:3px dotted #444!important;border-radius:15px 15px 15px 15px;cursor:pointer;float:right;padding:5px}
#nav_background:hover{background-color:#FFF}
#nav_background:active{background-color:#E71E7B}
Até mais!
Re: Background diferente para cada membro
impossivel me manda um print que mostra a tela redimensionada 100% pq aqui não da certo!
o código acima tbm não funcionou!
o código acima tbm não funcionou!
Re: Background diferente para cada membro
Olá!
Troque o código por este:
Melhores cumprimentos,
seender
Troque o código por este:
- Código:
#custom_background{background-size: 100%;filter:alpha(opacity=93);-moz-opacity:0.93;opacity:0.93; background-attachment:fixed;background-color:#361010; background-image:url('http://i31.servimg.com/u/f31/17/41/76/40/backgr21.jpg') !important;box-shadow:0 0 10px rgba(0,0,0,0.8) inset;color:#FFF;position:relative;padding:15px 0 15px 15px}
#custom_background span{-moz-transition:all .2s ease-in-out 0;background:none no-repeat scroll 50% 50% #000;border-radius:7px 7px 7px 7px;box-shadow:0 1px 7px #000 inset, 0 1px 0 rgba(255,255,255,0.05), 0 0 1px rgba(255,255,255,0.35);cursor:pointer;display:block;float:left;height:90px;margin-right:15px;width:140px}
#custom_background span:hover{box-shadow:0 1px 2px #000 inset, 0 1px 0 rgba(255,255,255,0.05), 0 0 1px rgba(255,255,255,0.35)}
#bg1{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/zerg11.jpg)!important;background-repeat:repeat-x!important}
#bg6{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/1jimra10.png)!important;background-repeat:repeat-x!important}
#bg5{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/1tychu10.png)!important}
#bg2{background-image:url(http://i1359.photobucket.com/albums/q800/azure91/Forum/protoss_zpsc0553b1f.jpg)!important}
#bg3{background-image:url(http://i1359.photobucket.com/albums/q800/azure91/Forum/fundo_zps7e8c3ea7.jpg)!important}
#bg4{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/1kerri10.png)!important}
#custom_url{clear:left;padding-top:10px;text-align:center}
#custom_input{background:none repeat scroll 0 0 rgba(0,0,0,0.5);border:0 none;border-radius:4px 4px 4px 4px;box-shadow:0 1px 3px rgba(0,0,0,0.75) inset, 0 1px 0 rgba(255,255,255,0.15);color:#FFF;font-size:20px;height:40px;margin-left:-15px;margin-right:8px;white-space:nowrap;width:780px;padding:0 10px 0 0}
#custom_submit{background:url(http://i48.servimg.com/u/f48/16/58/89/73/highli10.png) repeat-x scroll 0 0 rgba(197,206,213,0.4);border-radius:4px 4px 4px 4px;box-shadow:0 1px 3px rgba(0,0,0,0.6);color:#FFF;cursor:pointer;display:inline-block;font-size:20px;font-weight:400;line-height:40px;text-shadow:0 -1px 0 #4C5057;padding:0 10px}
.bg1{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/zerg11.jpg) !important;background-repeat:no-repeat;background-attachment:fixed;}
.bg2{background-image:url(http://i1359.photobucket.com/albums/q800/azure91/Forum/protoss_zpsc0553b1f.jpg)!important;background-repeat:no-repeat;background-attachment:fixed;}
.bg3{background-image:url(http://i1359.photobucket.com/albums/q800/azure91/Forum/fundo_zps7e8c3ea7.jpg)!important;background-repeat:no-repeat;background-attachment:fixed;}
.bg4{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/kerrig12.jpg)!important;background-repeat:no-repeat;background-attachment:fixed;}
.bg5{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/tychus11.jpg)!important;background-repeat:no-repeat;background-attachment:fixed;}
.bg6{background-image:url(http://i72.servimg.com/u/f72/17/41/76/40/jim_ra10.jpg)!important;background-repeat:no-repeat;background-attachment:fixed;}
.bg_custom{background-attachment:fixed;background-color:#000;background-repeat:no-repeat;background-attachment:fixed;}
#nav_background{background-color:#000;border:3px dotted #444!important;border-radius:15px 15px 15px 15px;cursor:pointer;float:right;padding:5px}
#nav_background:hover{background-color:#FFF}
#nav_background:active{background-color:#E71E7B}
Melhores cumprimentos,
seender
Página 1 de 2 • 1, 2
Tópicos semelhantes
» Adicionar ícone diferente para cada fórum
» [TUTORIAL] Background diferente para cada membro
» [dúvida] background diferente para cada membro
» [TUTORIAL] Background diferente para cada fórum
» Background diferente em cada página do portal
» [TUTORIAL] Background diferente para cada membro
» [dúvida] background diferente para cada membro
» [TUTORIAL] Background diferente para cada fórum
» Background diferente em cada página do portal
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre a aparência do fórum :: Questões resolvidas sobre a aparência do fórum
Página 1 de 2
Permissões neste sub-fórum
Não podes responder a tópicos