Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

FabianoSouza

Limitar caracteres conforme largura da DIV.

Por , em ASP Clássico

Recommended Posts

FabianoSouza    5

FabianoSouza
Postado

Não sei se a solução é com ASP ou JS mas preciso deste help.

Minhas DIVs se ajustam à largura da tela, sendo assim preciso que seja aproveitado o máximo possível da largura e colocar os "..."

no final, caso ocorra a abreviação do texto.

 

Em ASP dá pra resolver isso com o LEFT...mas usar como referência a largura da DIV não sei nem como começar.

 

Uma ajuda por caridade.

 

 

Compartilhar este post

Link para o post
Compartilhar em outros sites

xanburzum    169

xanburzum
Postado

eu uso assim:

 

<html><head>
<script type="text/javascript">
//Script by Klonder
function artigo1() {
var div1 = document.getElementById("artigo1");
var texto = new Array();
texto[0] = "Através do elemento input nós podemos criar botões, campos de texto, checkboxes, radios e muito mais. O HTML5 nos trouxe uma variedade de mais 13 novos tipos de elementos input que poderemos usar a partir de então. Infelizmente, a maioria dos navegadores, atualmente, como o Firefox e o Internet Explorer, não aceitam nem metade desses novos elementos. Nesse sentido, os mais atualizados são o Opera e o Google Chrome, nessa sequência. Nesse artigo, eu usei Opera 12.01 para exibir os exemplos desses novos elementos.";

texto[1] = "Ajax é a abreviação para 'Asynchronous Javascript and XML'. O objetivo dessa técnica é criar aplicações Web mais interativas e dinâmicas melhorando assim a experiência do usuário. Ajax não é uma tecnologia mas sim um termo que se refere ao uso de um grupo de tecnologias integradas (HTML/XHTML + XML/XSLT + CSS + DOM + Javascript + XMLHttpRequest). Fórum Moderado por: klaygomes, Otata, Darkdemo";

texto[2] = "Você poderá controlar esse novos campos com as propriedades max, min, value e step, entre as outras já existentes. O max irá definir um valor máximo. Por exemplo, no input typenumber, se você definir o valor max como 10, esse será o maior número selecionável. O mesmo ocorre com a propriedade min, que irá definir um valor mínimo. A propriedade step irá definir um valor de intervalo. No range, se você definir o step como 1.5, com a propriedade min em zero, a cada vez que você clicar no botão para aumentar, o número irá começar de zero e ir para 1.5, depois para 3, depois para 4.5, e assim sucessivamente.";

var artigoAtual = random(0,2);
div1.style.width = "150px";
div1.style.height = "150px";
div1.style.border = "#AAAAAA 1px dashed";
//div1.style.textAlign = "justify";
div1.innerHTML = texto[artigoAtual].substr(0,160)+"...";
}

function random(i,f) {
if (i > f) {numInicial = f;numFinal = i+1;}else{numInicial = i;numFinal = f+1;}
numRandom = Math.floor((Math.random()*(numFinal-numInicial))+numInicial);return numRandom;
}

</script>
</head>
<body onLoad="artigo1()">
<div id="artigo1"></div>
</body></html>

Compartilhar este post

Link para o post
Compartilhar em outros sites

FabianoSouza    5

FabianoSouza
Postado

eu uso assim:

 

<html><head>
<script type="text/javascript">
//Script by Klonder
function artigo1() {
var div1 = document.getElementById("artigo1");
var texto = new Array();
texto[0] = "Através do elemento input nós podemos criar botões, campos de texto, checkboxes, radios e muito mais. O HTML5 nos trouxe uma variedade de mais 13 novos tipos de elementos input que poderemos usar a partir de então. Infelizmente, a maioria dos navegadores, atualmente, como o Firefox e o Internet Explorer, não aceitam nem metade desses novos elementos. Nesse sentido, os mais atualizados são o Opera e o Google Chrome, nessa sequência. Nesse artigo, eu usei Opera 12.01 para exibir os exemplos desses novos elementos.";

texto[1] = "Ajax é a abreviação para 'Asynchronous Javascript and XML'. O objetivo dessa técnica é criar aplicações Web mais interativas e dinâmicas melhorando assim a experiência do usuário. Ajax não é uma tecnologia mas sim um termo que se refere ao uso de um grupo de tecnologias integradas (HTML/XHTML + XML/XSLT + CSS + DOM + Javascript + XMLHttpRequest). Fórum Moderado por: klaygomes, Otata, Darkdemo";

texto[2] = "Você poderá controlar esse novos campos com as propriedades max, min, value e step, entre as outras já existentes. O max irá definir um valor máximo. Por exemplo, no input typenumber, se você definir o valor max como 10, esse será o maior número selecionável. O mesmo ocorre com a propriedade min, que irá definir um valor mínimo. A propriedade step irá definir um valor de intervalo. No range, se você definir o step como 1.5, com a propriedade min em zero, a cada vez que você clicar no botão para aumentar, o número irá começar de zero e ir para 1.5, depois para 3, depois para 4.5, e assim sucessivamente.";

var artigoAtual = random(0,2);
div1.style.width = "150px";
div1.style.height = "150px";
div1.style.border = "#AAAAAA 1px dashed";
//div1.style.textAlign = "justify";
div1.innerHTML = texto[artigoAtual].substr(0,160)+"...";
}

function random(i,f) {
if (i > f) {numInicial = f;numFinal = i+1;}else{numInicial = i;numFinal = f+1;}
numRandom = Math.floor((Math.random()*(numFinal-numInicial))+numInicial);return numRandom;
}

</script>
</head>
<body onLoad="artigo1()">
<div id="artigo1"></div>
</body></html>

 

Olá xanburzum ...você sempre me quabrando o maior galho. Mais uma vez obrigado.

 

Rodei o código aqui...bem interessante. Mas esqueci de citar um detalhe. Precisaria que a coisa acontecesse conforne a largura da DIV na situação de redimensionamento da janela do navegador e conforme a resolução da tela.

 

Vi que na linha div1.style.height = "150px"; faço a alteração da larguda da DIV. Será que é o caso de eu ter que capturar a resolução e tamanho da janela para usar este dado para atualizar a propriedade da DIV? Seria essa a lógica?

Compartilhar este post

Link para o post
Compartilhar em outros sites

xanburzum    169

xanburzum
Postado

Fala ai FabianoSouza, beleza....

 

então, sugiro sim uma captura da resolução e incrementa um if para isso

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos ASP Clássico
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito