Categoria: javascript

Janela igual do MSN usando jquery

Custei um pouco pra achar uma que funcionasse legal, basicamente essa usa “jquery-ui dialog” com a posição no canto inferior direito da tela com o efeito tipo “slide”

Exemplo Funcional:
http://jsfiddle.net/AcesLinuX/fnAup/embedded/result/

Código-Fonte:
http://jsfiddle.net/AcesLinuX/fnAup/

 

Função javascript para imprimir pagina ao carregar

Tenho usado essa e funciona bem 😉

<script language="JavaScript" type="text/JavaScript">
<!--
function chromePrint(){
print();
}
function chromePrintDelay(){
setTimeout("print()", 500);
}
var browserName=navigator.appName;
if (browserName=="Microsoft Internet Explorer")
{
window.print();
}
else
  {
  if (browserName=="Netscape") //google chrome app.Name
  {
  chromePrintDelay();
  }
  else {
   window.onload = window.print; // helps with Opera
   }
   }
//-->
</script>

Exibindo e escondendo dinamicamente TR em uma tabela

Custei mas achei, eu tinha uma tabela com algumas TR escondidas via style, porém ao tirar eslas do “display:none” via javascript ficava desalinhado (todo o conteúdo da TR em uma única TD)

Fuçando muito, descobri o problema, o motor de renderização Trident (IE) utiliza  a propriedade block para exibir de forma generica, já os motores webkit (chrome, safari, etc) e gecko (firefox) utilizam “table-row”,

A função salvadora da pátria abaixo:

<script>
function toggle(id){
	if (document.getElementById && document.createTextNode)
	{
		var tr=document.getElementById(id);
		if (tr) {
			if (tr.style.display == 'none') {
				try {
					tr.style.display='table-row';
				} catch(e) {
					tr.style.display = 'block';
				}
			}
			else {
				tr.style.display = 'none';
			}
		}
	}
}
</script>

Atualização 21/03/2012:
Pra usar em uma TD, basta substituir table-row por table-cell

Selecionar abas dinamicamente usando jquery-ui tabs

Dois meios para selecionar uma aba no jquery-ui-tabs automaticamente ao carregar a página.

1> Obtendo a url via GET e selecionando a aba dinamicamente:

$(document).ready(function(){
	    var param = $(document).getUrlParam('aba');
	    $('#tabs-ui').tabs('select', param);
	});

Explicação: a variável param recebe o valor ‘aba’ vindo do get e seleciona aba com o mesmo nome. Ex: ?index.php?aba=calendario –> seleciona a tab com o id “calendario”
–> #tabs-ui deve ser substituido pelo ID da div container do jqueiryui-tabs

2> Selecionar tab automaticamente ao carregar a paina:

$(document).ready(function(){
	    $('#tabs-ui').tabs('select', 'tabs-adicionar');
	});

Explicação: Foca na div ‘tabs-adicionar’ dentro do container ‘tabs-ui’ ao carregar o documento.