[Resolvido] Memória Dinâmica

Vagner Nunes · Fevereiro 16, 2011

Prezados,

Uma boa tarde a todos...

Estou desenvolvendo um site para um cliente, e ele me solicitou, uma forma de quando uma pessoa abrir um artigo grande para leitura, e de acordo que a página é aberta, e em fração de segundos, e destacando em amarelo o texto, em três grupos de palavras, até o final do artigo.

Ex.:

A página abrirá um texto gravado no banco MySQL (já está pronto) e ao abrir destacando as palavras em grupo de três palavras. E se possível, ter uma forma de aumentar a velocidade desta marcação para a pessoa desenvolver a leitura com uma maior velocidade.

Não sei se posso fazer isso é PHP ou Javascript, alguém poderia me ajudar neste sentindo.

Sds,

Vagner Nunes

Andrey Knupp Vital · Fevereiro 16, 2011

Não entendi , você quer destacar as palavras o mais rapido possivel quando abrir a pagina ?

Vagner Nunes · Fevereiro 16, 2011

Olá Andrey,

Não... É o seguinte, o texto que irá aparecer será sempre textos enormes, então o cara tem que ler o texto rápido, porém tem que entende-lo, por isso é usado a leitura dinâmica.

Então, gostaria que ao abrir o texto do banco, carregar algo, ou alguma função, seja Javascript ou PHP, que faça um destaque em amarelo, de grupos de três palavras por vez, e depois de alguns segundo, automaticamente, destacar as próximas três palavras.

Obrigado,

Sds,

Vagner Nunes

Andrey Knupp Vital · Fevereiro 16, 2011

Continuo sem entender .. em certo tempo vai destacando as palavras ??

criatividade zero · Fevereiro 16, 2011

js apenas

Vagner Nunes · Fevereiro 16, 2011

Isso... Ele vai destacando as palavras em grupos de três palavras até chegar ao final do texto.

Sds,

Vagner Nunes

Beraldo · Fevereiro 16, 2011

Toda ação instantânea, sem refresh, é feita com JavaScript. Esse caso não é diferente :thumbsup:

Evandro Oliveira · Fevereiro 17, 2011

setInterval e Regexp

Se sentir dúvida com alguma das duas funções, basta postar.

Vagner Nunes · Fevereiro 21, 2011

Prezados,

Em relação a esse sistema de Leitura dinâmica, que estava querendo, achei um JavaScript que seria mais ou menos o que estou querendo, mas o problema é que ele seleciona grupo de palavras, mas gostaria que ele selecionasse um grupo por linha, e não continuasse a seleção na linha de baixo. E também tem como fazer ele funciona sem ser em um Textarea.

Veja: http://www.gouarts.com/Scripts/ditador.htm

Segue arquivos:

Página

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">




<title>Leitura Dinamica</title>

<link rel="stylesheet" href="ditador_arquivos/style.css">

<script src="ditador_arquivos/jquery.js"></script>
<script src="ditador_arquivos/jquery-ui-slider.js"></script>

<script type="text/javascript" src="ditador_arquivos/jscolor.js"></script>

<script src="ditador_arquivos/rsvp.js"></script>
<script src="ditador_arquivos/pagespecific.js"></script>

   <link type="text/css" href="ditador_arquivos/style_002.css" rel="stylesheet">
   <script src="ditador_arquivos/script.js" type="text/javascript"></script>
   <script type="text/javascript">
       function submitRating(evt)
       {
           var tmp = evt.target.getAttribute('id').substr(5);
           var widgetId = tmp.substr(0, tmp.indexOf('_'));
           var starNbr = tmp.substr(tmp.indexOf('_')+1);
           $.get("./feedback.php",
              { ratingID: widgetId, ratingValue: starNbr},
              function(data){
                $(".rating_stars").html("Thank you!");
              }
            );
       }

   function jqueryInit()
   {
       init_rating();
       $('span.rating_stars img').bind('click', submitRating);
   }

   $(document).ready(jqueryInit);

   function openFeedbackForm(){
   	$("#feedback_div").show();
   }

   function hideFeedbackForm(){
   	$("#feedback_div").hide();
   }

   function submitFeedback(){
       $.get("./feedback.php",
      { feedback: $("#feedback_text").val() },
      function(data){
        $("#feedback_div").html("Thank you for your comment.");
        setTimeout(function(){ $("#feedback_div").hide('slow'); }, 2000);
      }
    );
   }
   </script>

</head><body>
<h2><noscript>
 </noscript>
</h2>

<div style="margin: 0px 0px 15px 15px;"></div>

<div id="feedback_div" style="margin: 0px 0px 15px 15px; display: none;"><form action="./feedback.php" method="get"><textarea id="feedback_text" rows="3" cols="40"></textarea><br><input value="Send comment" onclick="submitFeedback()" type="button"><input value="Hide form" onclick="hideFeedbackForm()" type="button"></form></div>

<div id="tabs">
	<ul id="tabs_ul">
		<li id="textinput_tab">
			<a href="#" id="current" onclick="showtab(1); return false;">

				Escreva um texto				</a>			</li>
		<li id="playback_tab">
			<a id="" href="#" onclick="showtab(2); return false;">
				Visualizar				</a>			</li>
		<li id="info_tab"></li>
	</ul>
</div>


<div style="display: block;" id="textinput_pane" class="tab_pane">
	<div id="input_text">
		Para teste escreva um texto aqui!<br> <br>
		<textarea id="input_text_ta" cols="70" rows="10">A maioria das pessoas, quando perguntada, diz que não gosta de ler, porque isto lhe dá sono. Na verdade, não é a leitura que dá sono, e sim o modo como ela é realizada. Devido ao modo como aprendemos a ler, as pessoas ficam com hábitos prejudiciais de leitura , tais como:

1) Sub-vocalização(leitura como os lábios ou com a garganta)
2) Leitura Linear (palavra por palavra)
3) Leitura desatenta (com constantes re-leituras do mesmo trecho, e uma baixa retenção do conteúdo lido)

Também em razão deste tipo de leitura, as pessoas acostumam-se a ler pouco, o que acarreta na maioria dos casos num pequeno repertório de palavras. Assim, qualquer palavra que desconheçam (devido a pouca leitura) provoca-lhe um desconforto interno incosciente, que elas (as pessoas) procuram justificar-se dizendo para si próprio e para os outros que não gosta muito de ler.

Existem, então, dois motivos básicos pelos quais você lê errado:

1) o modo como aprendeu a ler.
2) ler de modo inconstante.

Na verdade, um decorre do outro: você lê pouco, devido ao modo como aprendeu a ler. É claro que isto não significa que não saiba ler; isto significa apenas que, em sua aprendizagem, foi imposto um limite à sua velocidade de leitura, limite este que você jamais tentou superar.

Quando se ensina uma pessoa a ler, as palavras são divididas em sílabas, para facilitar a aprendizagem da leitura. Além disso, as palavras são lidas em voz alta, sílaba por sílaba. Infelizmente, depois de aprendida a leitura, as pessoas continuam a ler fazendo esta vocalização das palavras; mesmo que silenciosamente. Na verdade, este é o maior obstáculo à leitura rápida.

Para aprender a ler dinamicamente, de um modo veloz e produtivo, você deve mudar o seu método de leitura, o que se pode conseguir com um treinamento especial. Primeiro, você deve perder o hábito de sub-vocalizar as palavras. depois, deve habituar-se a enxergar o conjunto de palavras, ao invés das palavras isoladas. À medida que progredir nos exercícios, você conseguirá enxergar blocos cada vez maiores de palavras de uma só vez. Com o exercícios, você conseguirá enxergar blocos cada vez maiores de palavras de um só vez. Com os exercícios de atenção, aprenderá a aumentar a sua atenção durante a leitura, o que fará que retenha cada vez mais o conteúdo do que ler.

A velocidade que conseguir atingir, a par desta retenção de conteúdo, darão um prazer cada vez maior às suas leituras.

Faço os seus exercícios progressivamente, sem pressa e sem pular nenhum, de modo persistente. Escolha um lugar sossegado, e procure colocar-se de modo relaxado e receptivo, confiando que irá conseguir o que deseja. </textarea>
		<br> <br>

		<a href="#" onclick="startNewPlayback(); return false;" title="Começar" onmouseover="$(this).find('img').attr('src', 'ditador_arquivos/playthattext2.jpg'); return false;" onmouseout="$(this).find('img').attr('src', 'ditador_arquivos/playthattext.jpg'); return false;"><img src="ditador_arquivos/playthattext.jpg"></a>
	</div>
</div>


<div style="display: none;" id="playback_pane" class="tab_pane">
	<div id="display">input some text <br>and click "Play <br></div>

	<div id="viewerTa_div" class="controls_div">
         <div style="margin-bottom: 8px;"><a href="#" onclick="$('#viewer_ta').toggle();" style="text-decoration: none;"><b>Ocultar/Mostrar Scroller</b></a>. <small>(Esse recurso só funciona no Firefox e no Internet Explorer - A rolagem não aparece em outros navegadores!)</small></div>
		<textarea id="viewer_ta" rows="5" cols="70"></textarea>
	</div>


	<div id="playback_controls" class="controls_div">
		<table id="controls_table">
			<tbody><tr>
				<td>
					<a href="#" onclick="playButtonCallback(); return false;" class="playback_control_a"><img src="ditador_arquivos/play.gif"></a>
					<a href="#" onclick="pauseButtonCallback(); return false;" class="playback_control_a"><img src="ditador_arquivos/pause.gif"></a>
					<a href="#" onclick="rewindButtonCallback(); return false;" class="playback_control_a"><img src="ditador_arquivos/rewind.gif"></a>
				</td>
				<td>

					<div class="ui-slider" id="slider_div">
						<a href="#" style="border: medium none ; outline-color: -moz-use-text-color; outline-style: none; outline-width: medium;"><div style="left: 70.07px;" class="ui-slider-handle"></div></a>
					</div>
				</td>
			</tr>
		</tbody></table>
	</div>

	<div id="settings" class="controls_div">
		<table id="settings_table">

			<tbody>
				<tr>
					<td>Números de Linhas (A): <input size="3" id="numLines" value="2" onchange="recomputeWpm()" type="text">  </td>
					<td>Palavras por linha (B): <input size="3" id="wordsPerLine" value="3" onchange="recomputeWpm()" type="text"></td>
				</tr>


				<tr>
					<td>Grupos por minutos(C): <input size="3" id="groupsPerMinute" value="100" onchange="recomputeWpm()" type="text">  </td>

					<td>(Calculo) Palavras por minutos (A*B*C): <input size="3" value="600" id="wordsPerMinute" onchange="recomputeWpm()" disabled="true" type="text"></td>
				</tr>


				<tr>
					<td style="text-align: left; font-weight: bold; font-size: 10pt;">
						Você também pode pressionar para cima / baixo nas setas do teclado <br> para aumentar / diminuir a velocidade.
				  </td>
					<td style="text-align: right;">
						<input value="Salvar Modificações" onclick="changeSettingsButtonCallback();" type="button">

					</td>

				</tr>
			</tbody>
		</table>
	</div>

	<div id="colors_div" class="controls_div" style="padding: 5px 0pt;">
		Cor de Fundo: <input style="background-color: #FFFFFF; color: rgb(0, 0, 0);" autocomplete="off" class="color" id="bg_color" size="6" value="#FFFFFF">

		   Cor do Texto: <input style="background-color: rgb(0, 0, 0); color: rgb(255, 255, 255);" autocomplete="off" class="color" id="text_color" size="6" value="000000">
	</div>
</div>

<div style="display: none;" id="info_pane" class="tab_pane">
	<h3> </h3> 
	</body></html>

pagespecific.js

// ---------------------------------------------------------------------------
// Functions that bind the UI to the Rsvp object

function extractSettings(){
return {
		'numLines': parseInt($('#numLines').val()),
		'wordsPerLine': parseInt($('#wordsPerLine').val()),
		'groupsPerMinute': parseInt($('#groupsPerMinute').val())
	};
}

function changeSettingsButtonCallback(){
var newSettings = extractSettings();

if($("#display").data('rsvpInstance'))
	$("#display").data('rsvpInstance').changeSettings(newSettings);

recomputeWpm();
}

function recomputeWpm(){
var newSettings = extractSettings();

$("#wordsPerMinute").val(
		newSettings.numLines *
		newSettings.wordsPerLine *
		newSettings.groupsPerMinute);
}

function _incrementSpeed(wpm_plus){
var rsvpInstance = $("#display").data('rsvpInstance');

if(rsvpInstance){
	newGpm = rsvpInstance.incrementSpeed(wpm_plus);
	$('#groupsPerMinute').val(newGpm);
	recomputeWpm();
}
}

function startNewPlayback(){
showtab(2);

var oldInstance = $("#display").data(
	'rsvpInstance');

if(oldInstance){
	oldInstance.destroy();
}

$('#viewer_ta').val($('#input_text_ta').val());

var rsvpInstance = new Rsvp(
		$("#input_text_ta").val(),
		$('#display'),
		extractSettings(),
		$('#slider_div'),
		$('#viewer_ta')
	);

$("#display").data(
	'rsvpInstance',
	rsvpInstance
);

rsvpInstance.start();
}

function handleSlideEvent(e, ui){
var newValue = ui.value;

var rsvpInstance = $("#display").data('rsvpInstance');

if(rsvpInstance){
	if(!rsvpInstance.sliderEventDisabled){
		rsvpInstance.moveToPercentage(newValue / 200);
	}
}
}

function playButtonCallback(){
var rsvpInstance = $("#display").data('rsvpInstance');

if(rsvpInstance){
	rsvpInstance.playOrResume();
}
}

function pauseButtonCallback(){
var rsvpInstance = $("#display").data('rsvpInstance');

if(rsvpInstance){
	rsvpInstance.pause();
}
}

function rewindButtonCallback(){
var rsvpInstance = $("#display").data('rsvpInstance');

if(rsvpInstance){
	rsvpInstance.rewind();
}
}

$(function(){
$('#slider_div').slider({ min: 0, max: 200, startValue: 0, slide: handleSlideEvent });
});

// ---------------------------------------------------------------------------
// Tabs and cosmetic code, unrelated to the Rsvp object

function _hideAllTabs(tabnum){
$('#textinput_tab a').attr('id', '');
$('#playback_tab a').attr('id', '');
$('#info_tab a').attr('id', '');

$('#textinput_pane').hide();
$('#playback_pane').hide();
$('#info_pane').hide();
}

function _getTab(tabnum){
switch(tabnum){
case 1: return $('#textinput_tab a');
case 2: return $('#playback_tab a');
case 3: return $('#info_tab a');
}
}

function _getPane(tabnum){
switch(tabnum){
case 1: return $('#textinput_pane');
case 2: return $('#playback_pane');
case 3: return $('#info_pane');
}
}

function _showOneTab(tabnum){
var tab = _getTab(tabnum);
var pane = _getPane(tabnum);

tab.attr('id', 'current');
pane.show();
}

function showtab(tabnum){
_hideAllTabs();
_showOneTab(tabnum);
}


function _keyupHandler(event){
keycode = event.keyCode;

if(keycode == 38){
	// up key
	_incrementSpeed(10)
}else if(keycode == 40){
	// down key
	_incrementSpeed(-10)
}

return false;
}

function _setBgColor(color){
$("#display").css("background-color", "#"+color);
$("#viewer_ta").css("background-color", "#"+color);
}

function _setFgColor(color){
$("#display").css("color", "#"+color);
$("#viewer_ta").css("color", "#"+color);
}

$(function(){
// To use the text given by the bookmarklet
var qs = window.location.search;

if(qs && qs.length > 1){
	$('#input_text_ta').val(decodeURIComponent(qs.substring(1)));
}

showtab(1);
$(".playback_control_a img")
	.mouseover(function(){ $(this).css('background-color', '#888'); })
	.mouseout(function(){ $(this).css('background-color', '#aaa'); });

$(document).keyup(_keyupHandler);

$("#bg_color").change(
	function(){ _setBgColor(  $("#bg_color").val()  );  }
	);
$("#text_color").change(
	function(){ _setFgColor(  $("#text_color").val()  );  }
	);

$("#viewer_ta").keydown(_keyupHandler);
});

rsvp.js

function Rsvp(text, targetDiv, settings, slider, viewerTa){
this._text = text;
this._targetDiv = targetDiv;
this._slider = slider;
this._viewerTa = viewerTa;

this.changeSettings(settings);

this._initializeFromText(text);

this._nextWordIndex = 0;
this._curTimeout = null;

this.sliderEventDisabled = false;

this._playing = false;

this._destroyed = false;
}

Rsvp.fn = Rsvp.prototype;

Rsvp.fn._initializeFromText = function(text){
// match a word and a bunch of non-word-stuff
// "g" is important if we want lastIndex to be remembered in match object
var regex = new RegExp("([^\\s]+)\\s+", "mg");

this._words = [];
this._wordPositions = [];

var match = null;
var i = 0;
var lastLastIndex = 0;
while((match = regex.exec(text)) != null){
	this._words[i] = match[1];
	this._wordPositions[i] = lastLastIndex;
	lastLastIndex = regex.lastIndex;
	i++;
}

// last word if there's some text remaining
this._words[i] = text.substring(lastLastIndex);
this._wordPositions[i] = lastLastIndex;

i++;

// To make the final iteration in selectRange work
this._wordPositions[i] = text.length-1;
}

Rsvp.fn.destroy = function(){
this.pause();

this._destroyed = true;
}

Rsvp.fn.changeSettings = function(settings){
this._numLines = settings.numLines;
this._wordsPerLine = settings.wordsPerLine;
this._groupsPerMinute = settings.groupsPerMinute;

this._wordsPerGroup = this._numLines * this._wordsPerLine;

this._msPerGroup = 60 * 1000 / this._groupsPerMinute;
}

Rsvp.fn.incrementSpeed = function(wpm_plus){
this._groupsPerMinute += wpm_plus;

if(this._groupsPerMinute < 1){
	alert("Minimum at 1 group per minute");
	this._groupsPerMinute = 1;
}

this._msPerGroup = 60 * 1000 / this._groupsPerMinute;

return this._groupsPerMinute;
}

Rsvp.fn.start = function(){
this._playing = true;

this.nextFrame();
}

Rsvp.fn.nextFrame = function(){
this.showTextRange();

// Adjust slider
this.sliderEventDisabled = true;

var pos = (this._nextWordIndex - this._wordsPerGroup)
			/ (this._words.length - this._wordsPerGroup)
			* 200;
$(this._slider).slider("moveTo", Math.round(pos), 0);

this.sliderEventDisabled = false;


// Timer for next frame
if(this._playing && this._nextWordIndex < this._words.length){
	this.setTimeout();
}
}

Rsvp.fn.moveToPercentage = function(percent){
var startWord = Math.floor(percent * this._words.length);

// Round to correct start word (ie. if wordsPerGroup = 4,
// we want groups to start at 0, 4, 8, ...)
startWord -= startWord % this._wordsPerGroup;

this.showTextRange(startWord);
}

Rsvp.fn.showTextRange = function(firstWordIndex){
if(firstWordIndex === undefined)
	firstWordIndex = this._nextWordIndex;

this._nextWordIndex = firstWordIndex;

var resHtml = "";
var firstWordBeginPos = this._wordPositions[firstWordIndex];
for(var i=0; i<this._numLines; i++){
	for(var j=0; j<this._wordsPerLine; j++){
		if(this._nextWordIndex >= this._words.length){
			this._playing = false;
			break;
		}

		resHtml += this._words[this._nextWordIndex] + " ";

		this._nextWordIndex++;
	}

	if(this._nextWordIndex >= this._words.length){
		this._playing = false;
		break;
	}

	resHtml += "<br/>";
}
var lastWordEndPos = this._wordPositions[this._nextWordIndex];

this.selectRangeInViewer(firstWordBeginPos, lastWordEndPos);

$(this._targetDiv).html(resHtml);
}

Rsvp.fn.setTimeout = function(){
if(this._destroyed)
	// no more setting of timeout after this point...
	// otherwise it might conflict with another object
	return;

// make sure the old timeout is cleared, otherwise timers compete
if(this._curTimeout)
	clearTimeout(this._curTimeout);

var self = this;

this._curTimeout = setTimeout(
		function(){ self.nextFrame(); },
		this._msPerGroup
	);
}

Rsvp.fn.pause = function(){
clearTimeout(this._curTimeout);

this._playing = false;
}

Rsvp.fn.playOrResume = function(){
this._playing = true;

this.setTimeout();
}

Rsvp.fn.rewind = function(){
this._nextWordIndex = 0;

this.nextFrame();
}

Rsvp.fn.selectRangeInViewer = function(start, end){
var ta = $(this._viewerTa).get(0);

if(!$(this._viewerTa).is(":visible")){
	return;
}

if (ta.createTextRange) {
	var oRange = ta.createTextRange();
	oRange.collapse(true);
	oRange.moveStart("character", start);
	oRange.moveEnd("character", end-start);
	oRange.select();

} else if (ta.setSelectionRange) {
	ta.setSelectionRange(start,start+1);

	// causes scrolling to caret position in IE, seen there:
	// http://bytes.com/forum/thread496726.html
	// Only works in Firefox... Opera and Safari won't collaborate
	if(window.KeyEvent){
		var ev = document.createEvent ('KeyEvents');
		ev.initKeyEvent('keypress', true, true, window,
							false, false, false, false, 0,
							ta.value.charCodeAt(start));
		ta.dispatchEvent(ev);
	}

	ta.setSelectionRange(start, end);
}
//$(this._viewerTa).blur();

}

Sds,

Vagner Nunes

Vagner Nunes · Fevereiro 22, 2011

Achei um site completinho do que estava querendo.

Alguém conhece algum sistema similar, ou me ajudaria a desenvolver algo parecido?

Leitura Dinâmica

Evandro Oliveira · Fevereiro 26, 2011

Como eu disse, nada além de expressões regulares e setInterval:

var memoria = function(){
   var texto = document.getElementByid('texto');
   var repl = texto.innerHTML;
   repl.replace(/((.*?\s){1,3})/, '<span>$1</span>'); // Envolvemos grupos de até 3 palavras em tags <span>
   texto.innerHTML = repl;
   var partes = texto.getElementsByTagName('span');
   var parte = 0;
   var tempo = 1; // Tempo de transição (em segundos)
   setInterval(function(){
       if(parte > 0) {
           var anterior = parte - 1;
           partes[anterior].style.backgroundColor = 'transparent';
           partes[anterior].style.color = 'inherit';
      }
      if(parte === partes.length) parte = 0;
      partes[parte].style.backgroundColor = '#000';
      partes[parte].style.color = '#fff';
      parte++;
   }, tempo * 1000);
}

Vagner Nunes · Fevereiro 26, 2011

Como posso chamar essa variável no texto?

Evandro Oliveira · Fevereiro 27, 2011

A segunda linha procura por um elemento cujo ID seja 'texto'

<p id="texto">este é um texto com mais de três palavras que deverá alternar o plano de fundo e texto para leitura dinâmica</p>

Vagner Nunes · Fevereiro 28, 2011

Olá Evandro,

Obrigado pelas dicas....

Não estou conseguindo, veja se estou no caminho certo!!!

Criei um arquivo chamado ler.js

var memoria = function(){
   var texto = document.getElementByid('texto');
   var repl = texto.innerHTML;
   repl.replace(/((.*?\s){1,3})/, '<span>$1</span>'); // Envolvemos grupos de até 3 palavras em tags <span>
   texto.innerHTML = repl;
   var partes = texto.getElementsByTagName('span');
   var parte = 0;
   var tempo = 1; // Tempo de transição (em segundos)
   setInterval(function(){
       if(parte > 0) {
           var anterior = parte - 1;
           partes[anterior].style.backgroundColor = 'transparent';
           partes[anterior].style.color = 'inherit';
      }
      if(parte === partes.length) parte = 0;
      partes[parte].style.backgroundColor = '#000';
      partes[parte].style.color = '#fff';
      parte++;
   }, tempo * 1000);
}

e criei um arquivo chamado index.php, que chama a função ler.js

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script language="JavaScript" src="ler.js"></script>
</head>

<body>

<label>
<input type="button" id="texto" onClick="texto(document.getElementById('texto').value, texto)" value="Iniciar" />
</label>

<div id="texto">
O constitucionalismo, teoria que deu ensejo à elaboração do que é formalmente chamado de Constituição, surgiu a partir das teorias iluministas e do pensamento que também deu base à Revolução Francesa de 1789.

Considera-se a Magna Carta o documento que esboçou o que posteriormente seria chamado de Constituição. Foi assinada pelo Príncipe João Sem-Terra face à pressão dos barões da Inglaterra medieval, e apesar da notícia histórica de que os únicos que se beneficiaram com tal direito foram os barões ingleses, o documento não perde a posição de elemento central na história do constitucionalismo ocidental. A partir da moderna doutrina constitucionalista, a interpretação dada à Magna Carta sofre um processo de mutação denominado mutação constitucional, donde novos personagens ocupam as posições ocupadas originalmente pelos participantes daquele contrato feudal, de maneira que as prerrogativas e direitos que foram concedidos aos barões passam a ser devidos aos cidadãos, e os deveres e limitações impostos ao Príncipe João Sem-Terra passam a limitar o poder do Estado.

Contudo, foi a partir das "Revoluções Liberais" (Revolução Francesa, Revolução Americana e Revolução Industrial) que surgiu o ideário constitucional, no qual seria necessário, para evitar abusos dos soberanos em relação aos súditos, que existisse um documento onde se fixasse a estrutura do Estado, e a conseqüente limitação dos poderes do Estado em relação ao povo.

Com o passar do tempo, em especial com as teorias elaboradas por Hans Kelsen, grande jurista da Escola Austríaca da primeira metade do Século XX, passou-se a considerar a Constituição não como apenas uma lei limitadora e organizativa, mas como a própria fonte de eficácia de todas as leis de um Estado. Tal teoria (chamada de Teoria Pura do Direito, de Kelsen), apesar de essencial para a formação de um pensamento mais aprofundado acerca desta norma, não dá todo o alcance possível do poder e função constitucional.

Mais tarde, outros pensadores como Konrad Hesse, Robert Alexy e Ronald Dworkin contribuíram sobremaneira para definir a real função da Constituição. Esta norma, superior a todas, não teria apenas a função de garantir a existência e limites do Estado. Ao contrário, ao invés de apenas ter um caráter negativo em relação ao exercício dos direitos das pessoas, a Lei Maior deve prever os Direitos Fundamentais inerentes a cada pessoa, e prever modos de garantir a eficácia dos mesmos, de modo que o Estado não apenas se negue a prejudicar as pessoas, mas sim cumpra aquela que é sua função precípua: a promoção da dignidade da pessoa humana.
</div>

</body>
</html>

Rafael Sirotheau · Fevereiro 28, 2011

Serve jQuery??

fiz assim http://jsfiddle.net/rafasirotheau/Kswwv/1/

Veja se é mais ou menos o que voce quer...

Falta apenas definir a funcao que fara isso de tempos em tempos.. a cada clique, mais 3 palavras sao marcadas

Vagner Nunes · Fevereiro 28, 2011

Olá Rafael, ficou legal, mas, seria interesante, quando clicar em Iniciar, ele modificar automaticamente, sem precisar de clicar novamente. Como posso fazer isso?

Valeu...

Rafael Sirotheau · Fevereiro 28, 2011

veja esse entao

http://jsfiddle.net/rafasirotheau/Kswwv/4/

EDIT:

funciona, mas esta com erro pra finalizar a funcao.. trabalhndo nisso agora

EDIT 2:

agora esta ok

http://jsfiddle.net/rafasirotheau/Kswwv/7/

Vagner Nunes · Fevereiro 28, 2011

Legal, em qual linha que diminui a velocidade?

Bruno Augusto · Março 1, 2011

Não sei porque o tópico foi marcado como resolvido se ainda há dúvidas...

Enfim... Acredito que seja o valor da variável intervaloMS

Rafael Sirotheau · Março 1, 2011

exatamente.

Arquivado

[Resolvido] Memória Dinâmica

Recommended Posts

Vagner Nunes 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Andrey Knupp Vital 136

Compartilhar este post

Link para o post

Compartilhar em outros sites

Vagner Nunes 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Andrey Knupp Vital 136

Compartilhar este post

Link para o post

Compartilhar em outros sites

criatividade zero 17

Compartilhar este post

Link para o post

Compartilhar em outros sites

Vagner Nunes 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Beraldo 864

Compartilhar este post

Link para o post

Compartilhar em outros sites

Evandro Oliveira 331

Compartilhar este post

Link para o post

Compartilhar em outros sites

Vagner Nunes 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Vagner Nunes 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Evandro Oliveira 331

Compartilhar este post

Link para o post

Compartilhar em outros sites

Vagner Nunes 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Evandro Oliveira 331

Compartilhar este post

Link para o post

Compartilhar em outros sites

Vagner Nunes 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Rafael Sirotheau 43

Compartilhar este post

Link para o post

Compartilhar em outros sites

Vagner Nunes 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Rafael Sirotheau 43

Compartilhar este post

Link para o post

Compartilhar em outros sites

Vagner Nunes 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Bruno Augusto 417

Compartilhar este post

Link para o post

Compartilhar em outros sites

Rafael Sirotheau 43