bimonti's Content

#974917 Saber Quando Imagem Carregou No Ajax

Posted by bimonti on 22/07/2009, 09:37 in Javascript / DOM / AJAX / ECMAScript

Isso mesmo, como o Édipo citou. Eu usei isso em uma galeria de fotos para só disparar o efeito de fadeIn quando a imagem terminar de carregar. Em javascript as imagens são objetos também, então você pode instância-los. Vou postar o snippet que eu tenho, mas só se atente ao load da imagem pq essa função é executada por outra.

function swapPic(){
	var self = this;
	
	// Preload the Image
	var image = new Image();
		image.onload = function(){
			self.fade();	
		}
	image.src = this.pic;

	this.obj.src = this.pic;

	this.callback = self.remove;
	this.to 	= 100;
	this.from 	= 0;
	this.curr	= this.from;
	
}

#969802 Slideshow - Buscando Dados Do Mysql

Posted by bimonti on 05/06/2009, 09:15 in PHP

Normal ... acontece ... rsrsrs :click:

Abraços.

#969647 Caixa De Texto/cursor

Posted by bimonti on 04/06/2009, 01:59 in Javascript / DOM / AJAX / ECMAScript

Sim, é possível mas meio trabalhoso. Veja esse exemplo que eu tinha nos confins do HD:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
	<title>Extended functionaly for textelements</title>
	<script type="text/javascript">
			function insertAtCaret(obj, text) {
		if(document.selection) {
			obj.focus();
			var orig = obj.value.replace(/\r\n/g, "\n");
			var range = document.selection.createRange();

			if(range.parentElement() != obj) {
				return false;
			}

			range.text = text;
			
			var actual = tmp = obj.value.replace(/\r\n/g, "\n");

			for(var diff = 0; diff < orig.length; diff++) {
				if(orig.charAt(diff) != actual.charAt(diff)) break;
			}

			for(var index = 0, start = 0; 
				tmp.match(text) 
					&& (tmp = tmp.replace(text, "")) 
					&& index <= diff; 
				index = start + text.length
			) {
				start = actual.indexOf(text, index);
			}
		} else if(obj.selectionStart) {
			var start = obj.selectionStart;
			var end   = obj.selectionEnd;

			obj.value = obj.value.substr(0, start) 
				+ text 
				+ obj.value.substr(end, obj.value.length);
		}
		
		if(start != null) {
			setCaretTo(obj, start + text.length);
		} else {
			obj.value += text;
		}
	}
	
	function setCaretTo(obj, pos) {
		if(obj.createTextRange) {
			var range = obj.createTextRange();
			range.move('character', pos);
			range.select();
		} else if(obj.selectionStart) {
			obj.focus();
			obj.setSelectionRange(pos, pos);
		}
	}
	</script>
</head>
<body>
	<form name="form">
		<input type="button" value="Insert text" onclick="insertAtCaret(this.form.text, 

this.form.string.value)">
		<input type="text" name="string"><br />		
		<textarea name="text" cols="60" rows="10"></textarea>
	</form>
</body>
</html>

Enquanto o FF usa selectionStart e selectionEnd, o IE usa selection e selection.createRange ... tem umas coisas interessantes pela internet sobre essas funções, embora o exemplo acima seja bem funcional.

#969646 Mudança De Imagem De Background

Posted by bimonti on 04/06/2009, 01:49 in Javascript / DOM / AJAX / ECMAScript

Mais um pergunta que só exige pouco conhecimento em javascript e DOM básico. Vou supor que a imagem está dentro de um elemento div, mude de acordo:

<div id="fundo" style="background:#fff;width:250px;height:250px;display:block;">
  <a href="#" onclick="this.parentNode.style.backgroundColor='#ff0'">Amarelo</a>
  <a href="#" onclick="this.parentNode.style.backgroundColor='#f00'">Vermelho</a>
</div>

#969645 Javascript - Mudança De Texto

Posted by bimonti on 04/06/2009, 01:40 in Javascript / DOM / AJAX / ECMAScript

Simples fazer isso, requer só um pouco de conhecimento em javascript e DOM, ex.:

<a href="#" onclick="this.innerHTML='Galeria 2009'">Clique aqui para mais fotos.</a>

#969644 Saiba Mais No Titulo

Posted by bimonti on 04/06/2009, 01:38 in HTML, CSS e Metodologias

É um script normal de toggle div on/off. Tem várias dúvidas similares aqui no fórum de como mostrar / esconder uma div, mas é mais ou menos assim:

<a href="#" onclick="document.getElementById('mostra').style.display='block'">Mostrar</a>
<div style="display:none" id="mostra">Texto</div>

Existem várias opções extras, como a própria função javascript verificar se a div está visivel ou não para trabalhar de acordo, mudar a imagem no link do sinal de + para o sinal de -, etc.

Faça uma busca no fórum que tem muita coisa já.

#969643 Slideshow - Buscando Dados Do Mysql

Posted by bimonti on 04/06/2009, 01:32 in PHP

Você fez o debug do que está sendo impresso para o javascript ? Por exemplo, p array depois de impresso teria que ficar mais ou menos assim:

_imagens : [
			["imgs/slide/01.jpg","Campo","Estrada ao longo de imenso campo verde","1.htm"],
			["imgs/slide/02.jpg","Montanha","Montanha espelhada em lago gelado","2.htm"],
			["imgs/slide/03.jpg","Rio","Rio bravo em paraíso mata adentro","3.htm"],
			["imgs/slide/04.jpg","Praia","Praia de água límpida e areia fina","4.htm"]
		],

Faça o seguinte, depois de abrir a página onde vc adaptou, abra o código-fonte da página (o js) e veja o que foi impresso e poste aqui. Ou poste um link para o slide. Você tem que ter certeza que a informação impressa está correta, se os caminhos para as imagens estão corretas, etc.

#968624 Puxar Dados De Um Xsl Via Php, é Possivel ?

Posted by bimonti on 27/05/2009, 02:30 in XML e Tecnologias Derivadas

É possível sim, mas você está tentando da forma errada. Coloca <?php ?> dentro do XSL vai dar erro mesmo já que o parser não entende isso. Você tem que definir todas as variáveis dentro do php e usar a função $foo-setParameter() para enviá-los ao XSL. Eu fiz isso a muuuuiiitoooo tempo atrás e não lembro exatamente a sintaxe. Abri aqui os arquivos mas eles são imensos e muitos complexos pra colar e você tentar entender então eu dei uma enxugada. Pode ser que não funcione mas você pelo menos saca a idéia.

PHP

// Load the XML source
			$xml = new DOMDocument( "1.0", "ISO-8859-1" );
			$xml->preserveWhiteSpace = false;
			$xml->formatOutput   = true;
			$xml->load('produtos/abc.xml');
			
			$xsl = new DOMDocument("1.0", "ISO-8859-1" );
			$xsl->preserveWhiteSpace = false;
			$xsl->formatOutput   = true;
			$xsl->load('produtos.xsl');
			
			// Configure the transformer
			$proc = new XSLTProcessor();
			$proc->importStyleSheet($xsl); // attach the xsl rules
			$proc->setParameter('','tempo',iconv("ISO-8859-1", "UTF-8",strftime('%A, %d/%m/%Y',strtotime('now'))));

			echo $proc->transformToXML($xml);

XSL

<xsl:template match="general" mode="indicar">
		 <dl>
			<dt>Enviada em:</dt>
			<dd><xsl:value-of select="$tempo" /></dd>
			<dt>De:</dt>
			<dd><span id="mail">xxx@xxx.com</span></dd>
		</dl>
</xsl:template>

Acho que dá pra entender. E como eu falei, copiar e colar não vai funcionar já que essa parte estava totalmente aninhada e relacionada a outro elementos. O que você precisa entender é que o php usa setParameter() para enviar e o XSL recebe isso como variável ($tempo).

Caso você queira usar essa variável dentro de algum parâmetro use colchetes:

<form action="{$path}indicar.php" method="post" onsubmit="post(this);return false;">

#968622 Bug Da Raposinha

Posted by bimonti on 27/05/2009, 02:13 in HTML, CSS e Metodologias

Non entendi ... o que você quer mudar a margem ? Nos elementos do menu ou no menu em si ? Se for no menu inteiro as vezes o problema pode ser padding do elemento pai.

#968621 Máscara De Campos

Posted by bimonti on 27/05/2009, 02:10 in Tutoriais e Artigos de Javascript, Ajax e Metodologias

Precisa alterar a expressão regular dentro da função. Ela substitui tudo que não for numérico (\d). Para aceitar letra substitua \d por \w. Qualquer coisa consulte um manual de Expressões Regulares (de preferência o da Mozilla que se refere especificamente a js) para mais opções de como usar a ER para manipular/validar os seus inputs.

#963247 Retornar Mais De Um Valor Atraves De Uma Funcao Javascript

Posted by bimonti on 07/04/2009, 15:30 in Javascript / DOM / AJAX / ECMAScript

Poderia só dar um enxutada no código e usar métodos melhores para isso do que o substring ou indexOf.

var mail = "dirceu@bimonti.net";
function test(x){
		if(x.match(/@/)){
			var y = x.split('@');
			return {'name':y[0],'address':y[1]}
		}
	}
	
var doSearch = test(mail);
	alert(doSearch['name']);
	alert(doSearch['address']);

O problema para retornar é que você não pode usar 2 returns em uma única função. Usou return ele vai sair da função. Você pode usar um objeto no retorno e depois usar como array (como usei no exemplo) ou usar com notação de objetos (doSearch.name,doSearch.address,etc.). Entendeu ?

#963246 Máscara De Campos

Posted by bimonti on 07/04/2009, 15:13 in Tutoriais e Artigos de Javascript, Ajax e Metodologias

<form name="teste">

	<input type="text" name="placa" onkeyup="maskIt(this,event,'###-####')" />

</form>

#934694 Detectar Disponibilidade De Um Protocolo

Posted by bimonti on 03/09/2008, 08:18 in Javascript / DOM / AJAX / ECMAScript

Acho que só assim mesmo ... o javascript não tem algo do tipo:

if(msnim){
  // Execução
}

Você pode até tentar algo semelhante, chamando a função direto dentro do if, mas acho que ele irá falhar.

#933537 Busca Em Ajax

Posted by bimonti on 28/08/2008, 14:35 in Ajax

Tenta tirar a função "teste"...

#932757 Notícias Em Slide

Posted by bimonti on 25/08/2008, 11:18 in Javascript / DOM / AJAX / ECMAScript

http://my.opera.com/bimonti

Eu fiz um há um tempo atrás... em jQuery tem vários também. É só usar a busca.

#932756 Script Que Inverte Arrays

Posted by bimonti on 25/08/2008, 11:16 in Javascript / DOM / AJAX / ECMAScript

Você está reinventando a roda:

<script>
var arr = [10,20,30,40,50];
	arr = arr.reverse();
	
	for(var x=0,y=arr.length;x<y;x++){
	 alert(arr[x]);
	}
</script>

PS.: Alex safado postou antes... ¬¬

#931509 Duvida Sobre Tag De Comentario

Posted by bimonti on 18/08/2008, 11:01 in CSS & Semântica (Tableless)

Browser sem suporte a CSS não vai considerar o seu estilo. Assim evitar de aparecer um monte de CSS como texto para os usuários.

É raro, mas se quiser pode colocar.

#931507 Imprimir Sem Aviso!

Posted by bimonti on 18/08/2008, 10:33 in Javascript / DOM / AJAX / ECMAScript

Que eu saiba, não.

#931153 Login - Overflow X Iframe

Posted by bimonti on 15/08/2008, 13:31 in CSS & Semântica (Tableless)

Não ... o iframe carrega outra página. Usando um div com overflow, só se usar AJAX por exemplo.

#931152 Ajax Cross Browser...

Posted by bimonti on 15/08/2008, 13:29 in Ajax

As far as i know... não.

Pra variar depende muito do que você quer fazer. O que você explicou até agora eu acho que não é possível. Mas você falou em serviço, eu já lembrei daquela sua outra dúvida, e pode ser que exista uma alternativa, um web service mesmo.

#931139 Ajax Cross Browser...

Posted by bimonti on 15/08/2008, 11:46 in Ajax

Não tem como ... ele não chega a enviar o formulário.

Se você está preocupado com segurança, pode mandar por get, mas antes gera um objeto JSON e serializa. Do outro lado faz o mesmo processo.

#931122 Resolução Fixa

Posted by bimonti on 15/08/2008, 10:38 in CSS & Semântica (Tableless)

Possível é... mas usando javascript é bem chato. Você vai precisar de muita noção sobre elementos e window. Domínio na linguagem também é bom. Um exemplo seria o webmail do Yahoo.

#931121 Ajax Cross Browser...

Posted by bimonti on 15/08/2008, 10:32 in Ajax

Google
Você quis dizer: Cross-Domain ?

#931119 Layer Cobrindo Toda A Página

Posted by bimonti on 15/08/2008, 10:27 in Javascript / DOM / AJAX / ECMAScript

Com css é o máximo que você vai conseguir fazer. Tem que usar javascript.

overlay = {
	
	add : function(){
		var c = overlay.getSize();
		var o = document.createElement("div");
			o.setAttribute("id", "overlay");
	
		document.body.appendChild(o);
	
		var el = document.getElementsByTagName('select');
		for(x=0,y=el.length;x<y;x++){
			_s(el[x],'visibility','hidden');
		}
	
		var el = $('overlay');
			el.className = "overlay";
			el.style.height = c.b+'px';	
	},
	
	remove : function(){
		document.body.removeChild($('overlay'));
		var el = document.getElementsByTagName('select');
		for(x=0,y=el.length;x<y;x++){
			_s(el[x],'visibility','visible');
		}
	},
	
	getSize : function(){
		var w = document.body.clientWidth || innerWidth;
		var h = document.body.clientHeight || innerHeight;
		var a = window.scrollMaxX || 0;
		var b = window.scrollMaxY || 0;
		return {a:w,b:h+b}
	}	
}

Eu fiz essa classe pra usar em um site. Não é difícil implementar, mas eu estou sem tempo agora. Tente fazer ae, qq coisa poste se tiver dúvidas. Você chama a classe assim overlay.add(); ... e precisa criar uma classe chamada overlay com a transparência que você quiser.

PS: Precisa dessas 2 funções tbm:

/* $();
 * Return a reference to the element
 * Usage: var el = $('id');
 */
function $(w){
		return document.getElementById(w);
}
/* _s();
 * Change the inline style of an element
 * Usage: _s($('id'),'color','#f00');
 */
function _s(obj,p,v){
	obj.style[p] = v;
}

#931117 Ler Html E Trocar Certas "tags"

Posted by bimonti on 15/08/2008, 10:24 in Javascript / DOM / AJAX / ECMAScript

Usando expressões regulares você consegue. Sabe usar ?

http://developer.mozilla.org

Tem referências no link acima. Regular Expressions, dentro de javascript.