Douglas Nogueira
-
Total de itens
13 -
Registro em
-
Última visita
Posts postados por Douglas Nogueira
-
-
Cara,
O código do fercosmig ta certo, o calculo somente será executado quando você tirar o foco do botão(clicar em outro lugar na página ou mudar de campo), o que você tem que se atentar é que o forum pra questões de segurança separam as funções javascript, como você pode ver no código do fercosmig a parte que chama a função está assim onBlur="java script: calcula();" quando deveria estar assim onBlur="java script:calcula();" sem espaço no meio de javascript e sem espaço depois dos dois pontos.
Att Douglas
-
Essas propriedades são do elemento de imagem do HTML 5.0, seguindo aqui a descrição da interface:
Especificação da Interface DOM no W3C:
[NamedConstructor=Image(),
NamedConstructor=Image(in unsigned long width),
NamedConstructor=Image(in unsigned long width, in unsigned long height)]
interface HTMLImageElement : HTMLElement {
attribute DOMString alt;
attribute DOMString src;
attribute DOMString useMap;
attribute boolean isMap;
attribute unsigned long width;
attribute unsigned long height;
readonly attribute unsigned long naturalWidth;
readonly attribute unsigned long naturalHeight;
readonly attribute boolean complete;
};
Elas representam o width e o height da imagem sem redimensionamento, por isso que no meu código ela está sendo multiplicada por um fator de zoom e atribuído a width e height, para as imagens serem exibidas nos tamanhos corretos.
O problema é que a imagem não possui o método onLoad...
Att,
Douglas
-
PessoALL,
No meu projeto de visualizador de documentos onde um pdf é transformado em imagem para visualização rápida na web, eu utilizo a seguinte função para carregar cada página que é exibida
function loadPage(page){
var img = document.getElementById(page);
if(img.loaded != true){
var newimage = new Image();
$.ajax({
url: getPageURI(page),
beforeSend: function(){
img.src = 'img/loading.png';
img.width = img.naturalWidth * ZoomStatus;
img.height = img.naturalHeight * ZoomStatus;
},
error: function(){
img.src = 'img/error.png';
img.width = img.naturalWidth * ZoomStatus;
img.height = img.naturalHeight * ZoomStatus;
},
success: function(data){
newimage.loaded = true;
newimage.src = getPageURI(page);
newimage.className = img.className
newimage.id = img.id;
newimage.width = newimage.naturalWidth * ZoomStatus;
newimage.height = newimage.naturalHeight * ZoomStatus;
$(img).replaceWith(newimage);
}
});
}
}
[/codebox]Onde essa função carrega as imagens na seguinte div:
[codebox]
<div id="ConteudoDocReader">
<a value="1">
<img id="1" class="PaginaDocReader" src="img/blank.png">
</a>
<br>
<a value="2">
<img id="2" class="PaginaDocReader" src="img/blank.png">
</a>
<br>
<a value="3">
<img id="3" class="PaginaDocReader" src="img/blank.png">
</a>
<br>
</div>Acontece que quando a função 'success' é executada no momento que o calculo do tamanho do width e do height são gerados, o naturalWidth e o naturalHeight não estão disponíveis ou são '0' logo a imagem assume um proporção nula, e não aparece.
Gostaria de saber como eu faço para assegurar que o os valores do atributo naturalWidth e naturalHeight possuam os valores corretos no momento da chamada.
Alguém tem alguma idéia?
Att Douglas.
-
Cara,
É o seguinte, tenho certeza que você não quer fazer isso com javascript, na verdade o processamento dos dados do formulário se dará em lado Servidor,e para isso você precisará de conhecimentos em uma linguagem de programação lado servidor, seja ela python, php, java, asp, ou que diabos for.
Precisará de um servidor web, faz o seguinte, aprende a instalar e configurar o apache com php e em seguida aprenda a manipular dados de formulário em php.
Feito tudo isso você estará apto a gravar os dados em banco de dados....
Agora, se você realmente quer um banco de dados Javascript, não se acanhe em ler o material mais estranho sobre javascript e banco de dados com javascript que eu encontrei, mas repito, isso é uma idéia muito estranha e sem juizo nenhum kkkkk
Boa sorte!
douglas
-
Tranquilamente poderia ser feito da maneira que o fercosmig indicou
Mas acho que seria mais elegante usar css, que é bem mais indicado para isso, basta você customizar a tag ou customizar uma classe, sendo assim todos os botões que usam essa folha de estilos ficaram customizados
button {
border: none;
background: url('/forms/up.png') no-repeat top left;
padding: 2px 8px;
}
button:hover {
border: none;
background: url('/forms/down.png') no-repeat top left;
padding: 2px 8px;
}
[/codebox]nesse aqui a classe tem que ser especificada: <button class="BotaoSuperSupimpa"/>
[codebox]
.BotaoSuperSupimpa{
border: none;
background: url('/forms/up.png') no-repeat top left;
padding: 2px 8px;
}
.BotaoSuperSupimpa:hover {
border: none;
background: url('/forms/down.png') no-repeat top left;
padding: 2px 8px;
}Desse jeito somente o botão especificado ficaria com as opções de estilo.
Att Douglas.
-
Aconselho que apsar de estar enviando tudo a partir de um formulário no qual o javascript cuida do toUpper, seria interessante que também o fizesse uso da função UPPER ( ) na sua query do banco, uma vez que isso faz parte dos seus requisitos, lembrando que javascript ajuda muito na hora de agregar valor nas interfaces mas não garante nada.
Att,
Douglas
-
Estranha esta questão, pelo que conheço de server side scripting a mesma não costuma interferir no comportamento do JavaScript, uma vez que o mesmo roda no Navegador, salvo em alguns casos quando se usa um framework como por exemplo Java Server Faces que altera o nome dos campos, causando assim alguma confusão nos desavisados, mas coloca seu código ASP aí, que daremos uma olhada apesar de não ser programador Asp, a lógica é igual pra tudo.
Abraços!
-
Mas que bizarrice.... não sei porque em duas linhas do código a palavra "javascript" ficou "java script", mas você estava certo, aquele código so funciona no firefox, não vou entra no méritos do motivo do IE diferir nas suas reações mas ta aí um código que testei nos 2.
<html>
<head>
<script type="text/javascript">
function mostraDiv(){
option = document.getElementById('123').value;
if(option == "gato"){
document.getElementById('gato').style.display = 'block';
document.getElementById('cachorro').style.display = 'none';
}else{
document.getElementById('gato').style.display = 'none';
document.getElementById('cachorro').style.display = 'block';
}
}
</script>
</head>
<body>
<form>
<select id='123' onChange="mostraDiv();">
<option value='gato'>Gato</option>
<option value='cachorro'>Cachorro</option>
</select>
</form>
<div id='gato' style="{display:none;}">
<label>Digite o nome do Gato:</label><input type="text"/>
</div>
<div id='cachorro' style="{display:none;}">
<label>Digite o nome do Cachorro:</label><input type="text"/>
</div>
</body>
</html>
[/codebox]tomara que de certo dessa vez.... :blink:
-
Parece ser isso que você precisa:
<html>
<head>
<script type="text/javascript">
function mostraDiv(div){
if(div.value == 'Gato'){
document.getElementById('gato').style.display = 'block';
document.getElementById('cachorro').style.display = 'none';
}else{
document.getElementById('gato').style.display = 'none';
document.getElementById('cachorro').style.display = 'block';
}
}
</script>
</head>
<body>
<form>
<select>
<option onClick="java script:mostraDiv(this);">Gato</option>
<option onClick="java script:mostraDiv(this);">Cachorro</option>
</select>
</form>
<div id='gato' style="{display:none;}">
<label>Digite o nome do Gato:</label<input type="text" />
</div>
<div id='cachorro' style="{display:none;}">
<label>Digite o nome do Cachorro:</label<input type="text" />
</div>
</body>
</html>
[/codebox]Claro que existe várias maneiras de fazer isso!
Abraços!
Douglas
-
Cara, você está enganado!
Seu código funciona direitinho, o que faltou foi você se ligar na seguinte linha do java script:
liquido.value = retorno.toFixed(2);
esse código faz com que o retorno seja de somente duas casas decimais...
Tente mudar para
liquido.value = retorno.toPrecision();
ou simplesmente para
liquido.value = retorno;
Falous!
Douglas
-
É uma pena que ninguém me ajudou a poupar algumas horinhas quebrando a cabeça, mas encontrei uma solução!
//executa positionDetection a cada 100 milesimos de segundo
function startDetection(){
setInterval("positionDetection()",100);
}
function positionDetection(){
var div = document.getElementById('ConteudoDocReader'); //DIV com ScrollBar
var elements = div.getElementsByTagName("img"); //Elementos de Imagem da DIV
var position = div.scrollTop; //atual posição da scrollbar
for(var i = 0, max = elements.length; i < max; ++i) {//para cada elemento de imagem da div
//Se ponto de inicio do elemento de imagem for maior que a posição da scrollbar
//somada com metade da altura da DIV
if(elements[i].offsetTop < position+(div.clientHeight/2)){
var CurrentElement = elements[i]; //Então imagem sendo exibida é o elemento atual
}
}
return CurrentElement;
}
[/codebox]É meio estranho responder a si mesmo mas fica aí para referências futuras para algum maluco que for se aventurar pelas mesmas águas!
Valeu!
Douglas
PS: Se alguém souber uma outra maneira ficarei feliz em avaliá-la!
-
Senhores(as),
Tenho o seguinte problema, tenho uma DIV que possui scrollbars, essa div está repleta de imagens, agora, o que preciso é de uma função que me retorne a imagem que aparece no navegador do usuário enquanto ele passa as imagens, retornando o ID da página atual que ele está visualizando. Estou tentando fazer um visualizador de documentos baseado em javascript, e preciso saber a página atual que o usuário está lendo para pré carregar uma quantidade definida das páginas seguintes, para evitar que o navegador baixe todas as imagens de uma vez e que o usuário tenha que ficar esperando carregar a imagem toda vez que muda de página, baixar todas as imagens tornaria o gasto de banda muito grande e processamento das imagens no servidor, uma vez que são extraídas de PDF quando visualizadas, e são milhares de imagens.
<div id='ConteudoDocReader' style={ position:absolute; float:right; overflow:auto;}>
<a name="1"/>
<img src="pagina1.png" id="1" width="800" height="1200"><br>
<a name="2"/>
<img src="pagina2.png" id="2" width="800" height="1200"><br>
<a name="3"/>
<img src="pagina3.png" id="3" width="800" height="1200"><br>
<a name="4"/>
<img src="pagina4.png" id="4" width="800" height="1200"><br>
<a name="5"/>
<img src="pagina5.png" id="5" width="800" height="1200"><br>
</div>
[/codebox]Seria uma funcionalidade parecida com a do Google Docs Viewer (http://docs.google.com/viewer), so que não tem como eu usá-lo, uma vez que os documentos são de acesso retrito.
Grato pela atenção dispensada,
Douglas
(Resolvido) Falha de Sincronia do Objeto de Imagem em função Ajax JQue
em Ajax, JavaScript, XML, DOM
Postado · Editado por Douglas Nogueira
KaKarotto,
A sua idéia do onLoad estava certa, não sei onde li que não havia onLoad para imagens, mas colocar o resize no onload deu certo, mas tive que fazer algumas adaptações, pois existe um navegador que não da suporte a essa especificação, nrem preciso dizer qual é né:
O código ficou assim:
Valeu,
Douglas