Protecção e Segurança Rodoviária

From Labmm2

(Difference between revisions)
Jump to: navigation, search
(→Conclusões)
Line 1: Line 1:
 +
=Elementos do grupo=
 +
 +
61181 ÁLVARO SÉRGIO PINHO FERREIRA
 +
51062 ANDRÉ RICARDO DE ASSUNÇÃO PEREIRA
 +
59805 ANDREIA MARISA COSTA BASTOS
 +
59735 FÁBIO OLIVEIRA ROCHA
 +
44417 RICARDO PERALTA MARQUES
 +
=Apresentação e contextualização do tema do projecto=
=Apresentação e contextualização do tema do projecto=
==Protecção e Segurança==
==Protecção e Segurança==

Revision as of 22:46, 21 June 2011

Contents

Elementos do grupo

61181 ÁLVARO SÉRGIO PINHO FERREIRA 51062 ANDRÉ RICARDO DE ASSUNÇÃO PEREIRA 59805 ANDREIA MARISA COSTA BASTOS 59735 FÁBIO OLIVEIRA ROCHA 44417 RICARDO PERALTA MARQUES

Apresentação e contextualização do tema do projecto

Protecção e Segurança

O grupo pretendeu desenvolver um Website, maioritariamente informativo, sobre prevenção rodoviária.

O objectivo é divulgar conceitos de boa conduta, segurança e protecção onde, através de um ambiente imersivo, enumerámos a grande maioria dos factores que põem em causa a vida dos cidadãos.

Este Website consiste em alertar os condutores para uma prevenção rodoviária eficiente.

O principal objectivo é, de acordo com o referido anteriormente, o desenvolvimento de uma mentalidade de cidadania, prudência e eficácia nos comportamentos a ter na estrada.

Objectivos gerais e específicos

CONDIÇÕES DE UTILIZAÇÃO DO PRODUTO FINAL

Locais: Onde o utilizador tiver acesso à internet, seja num computador, telemóvel, pda, etc…

Duração média da consulta: A duração média da consulta dependerá do conteúdo que o utilizador estiver interessado. Caso esteja interessado em consultar todo o conteúdo será cerca de 40 minutos.

Pretendemos que este seja visualizado através de forma a não comprometer o Layout em todos os browsers mais utilizados pela grande maioria dos utilizadores (IE, FireFox, Safari, Chrome …). Teremos a possibilidade de implementar diversas tecnologias, tais como, XHTML, CSS, JavaScript neste projecto e a dimensão 1000X700 será eleita para haver a possibilidade de abranger um maior número de utilizadores.

Publico-alvo

Layout

No layout deste projecto o grupo optou pela utilização de um ambiente imersivo. No primeiro ecrã são dispostos vários elementos visuais (páginas de jornal) no espaço O utilizador explora esta aplicação através do clique nestes elementos visuais.


Página Principal:

Página inicial de apresentação do website - Protecção e Segurança Rodoviária.

PSR-P.jpg


Página - Estatísticas:

Página que mostra links de ficheiros de consulta de estatísticas de acidentes na estradas de Portugal.

PSR-E.jpg


Página - Drogas

Página que mostra os diferentes e mais usuais tipos de drogas consumidos em Portugal.

PSR-D.jpg


Página - Segurança

Esta página consiste em alertar os condutores de veículos motorizados a ter em atenção os pontos de segurança que nesta são referidos.

PSR-S.jpg


Página - Emergências

Página com os procedimentos que deveremos ter ao ligar para o numero de Emergência internacional (112).

PSR-EM.jpg


Página - Formulário

Página de contacto para esclarecimento de duvidas ou de futuras publicações sobre procedimentos a ter.

PSR-F.jpg


Página - Contactos

Página de contacto e comentários sobre o site.

PSR-C.jpg

Análise da concorrência

  • Analisamos websites portugueses e estrangeiros e vimos que são todos muito completos no que toca a disponibilização de conteúdos e consequentemente na sua organização, sendo toda a informação de fácil consulta.

  • As falhas que vimos foram mais a nível de interactividade, onde este cariz está pouco presente, tornando o próprio site de aspecto um pouco mais "aborrecido", não aproveitando todas as vertentes práticas e interactivas que um site com a vertente de segurança e protecção pode ter.

  • Temos como tal para o nosso site o objectivo de organização de conteúdos disponibilizados e a exploração ao nível interactivo e de animação, oferecendo ao utilizador um site activo em que poderá aprender as regras de segurança de uma forma mais dinâmica. Websites concorrentes:

    http://www.segurancarodoviaria.pt/noticias

    http://www.brisa.pt/PresentationLayer/conteudo.aspx?menuid=8

    http://www.dontriskit.info/country-roads/home/

    http://think.direct.gov.uk/index.html

    Estrutura XHTML implementada

    <!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" xmlns:fb="http://www.facebook.com/2008/fbml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Prevenção e Segurança Rodoviária</title>
<style></style>
<link media="screen" rel="stylesheet" href="css/css.css" />
<script type="text/javascript" src="js/queryLoader.js"></script>
<script type="text/javascript" src="js/script.js" ></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js">
</script>
	<script src="js/jquery.colorbox.js"></script>

	<script>
		$(document).ready(function(){
			
			$(".drogas").colorbox({innerWidth:"500px", innerHeight:"500px", iframe:false});
			$(".comentarios").colorbox({innerWidth:"520px", innerHeight:"500px", iframe:false});
			$(".formulario").colorbox({innerWidth:"500px", innerHeight:"500px", iframe:false});
			$(".emergencias").colorbox({innerWidth:"500px", innerHeight:"500px", iframe:false});
			$(".segurança").colorbox({innerWidth:"500px", innerHeight:"500px", iframe:false});
			$(".estatisticas").colorbox({innerWidth:"500px", innerHeight:"300px", iframe:false});
		});
	</script>
	</head>

	<body>
<div id="wrapper">
      <div id="site"> </div>
      <div id="estatisticas"> </div>
      <div id="drogas"> </div>
      <div id="seguranca"> </div>

  <div id="emergencias"> </div>
      <div id="bloco"><img src="imagens/pixel.png" width="1024px" height="650px" usemap="#bloco" /> </div>
      <div id="maps">
    <map name="bloco" id="bloco" style="visibility:hidden">
              <area shape="poly" coords="536,650,474,470,458,415,638,371,654,378,667,402,689,399,722,483,698,492,736,611,726,623,616,647,533,646,454,417" href="quemsomos.html" alt="Quem Somos" class="comentarios cboxElement" onmouseover="opacidade('bloco',1)" onmouseout="opacidade('bloco',0)" />
      <area shape="poly" coords="284,539,-4,437,-4,307,96,96,266,157,335,443,266,464,262,479,275,508" alt="estatisticas" href="estatisticas.html" class="estatisticas cboxElemnet" onmouseover="opacidade('estatisticas',1)" onmouseout="opacidade('estatisticas',0)"/>
          <area shape="poly" coords="232,8,336,442,376,432,605,27,641,42,637,1,637,1" href="drogas.html" alt="Drogas" class="drogas cboxElement" onmouseover="opacidade('drogas',1)" onmouseout="opacidade('drogas',0)" />
          <area shape="poly" coords="802,108,606,29,375,431,496,407,456,359" alt="Segurança" href="seguranca.html" class="segurança cboxElement" onmouseover="opacidade('seguranca',1)" onmouseout="opacidade('seguranca',0)"  />

          <area shape="poly" coords="733,602,1019,390,1019,157,901,32,458,360,495,406,636,372,653,379,667,402,687,399,721,483,697,492" alt="Emergências" onmouseover="opacidade('emergencias',1)" href="emergencias.html" class="emergencias cboxElement" onmouseout="opacidade('emergencias',0)" />
        <area shape="poly" coords="533,649,455,415,268,460,264,476,323,648" alt="Formulário de Contacto" onmouseover="opacidade('bloco',1)" href="formulario.html" class="formulario cboxElement" onmouseout="opacidade('bloco',0)" />
    </map>
  </div>
    </div>
<script type="text/javascript">
	QueryLoader.init();
</script>
</body>
</html>

    Folhas de estilos (CSS)

    
/* PRELOADER  */
.QOverlay {
	background-color: #000000;
	z-index: 9999;
}
.QLoader {
	background-color: #CCCCCC;
	height: 1px;
}
/*  /PRELOADER  */

/*  DIVs  */
body {
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#000;
	background-color:#000;
	padding:0px;
	text-align:justify;
	margin:0px;
}
img {
	border:none;
}
#wrapper {
	width:1024px;
	height:650px;
	bottom: 50%;
	right: 50%;
	position:absolute;
}
#site {
	left: 50%;
	position: relative;
	top: 50%;
	width:1024px;
	height:650px;
	background-image:url(../imagens/fundo.jpg);
}
#bloco {
	left: 50%;
	position: relative;
	top: 50%;
	background-image:url(../imagens/bloco.png);
	width:1024px;
	height:650px;
	position:absolute;
	opacity:0.9;
	filter:alpha(opacity=90);
	-moz-opacity: .9;
}
#drogas {
	left: 50%;
	position: relative;
	top: 50%;
	width:1024px;
	height:650px;
	background-image:url(../imagens/Drogas.png);
	position:absolute;
	opacity:0.9;
	filter:alpha(opacity=90);
	-moz-opacity: .9;
}
#emergencias {
	left: 50%;
	position: relative;
	top: 50%;
	width:1024px;
	height:650px;
	background-image:url(../imagens/emergencias.png);
	position:absolute;
	opacity:0.9;
	filter:alpha(opacity=90);
	-moz-opacity: .9;
}
#seguranca {
	left: 50%;
	position: relative;
	top: 50%;
	width:1024px;
	height:650px;
	background-image:url(../imagens/Seguranca.png);
	position:absolute;
	opacity:0.9;
	filter:alpha(opacity=90);
	-moz-opacity: .9;
}
#estatisticas {
	left: 50%;
	position: relative;
	top: 50%;
	width:1024px;
	height:650px;
	background-image:url(../imagens/estatisticas.png);
	position:absolute;
	opacity:0.9;
	filter:alpha(opacity=90);
	-moz-opacity: .9;
}
#comentarios {
	background:#09F;
}
/*  /DIVs  */

h1 {
	text-align:center;
	text-transform:uppercase;
	background:#999;
	color:#fff;
}
#conteudo {
	width:475px;
	background-color:#fff;
	overflow:hidden;
	margin-bottom:25px;
}
#conteudo img {
	margin-top:20px;
	margin-right:10px;
	float:left;
}
/*
POPUP
*/
#colorbox, #cboxOverlay, #cboxWrapper {
	position:absolute;
	top:0;
	left:0;
	z-index:9999;
	overflow:hidden;
}
#cboxOverlay {
	position:fixed;
	width:100%;
	height:100%;
}
#cboxMiddleLeft, #cboxBottomLeft {
	clear:left;
}
#cboxContent {
	position:relative;
}
#cboxLoadedContent {
	overflow:auto;
}
#cboxTitle {
	margin:0;
}
#cboxLoadingOverlay, #cboxLoadingGraphic {
	position:absolute;
	top:0;
	left:0;
	width:100%;
}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow {
	cursor:pointer;
}
.cboxPhoto {
	float:left;
	margin:auto;
	border:0;
	display:block;
}
.cboxIframe {
	width:100%;
	height:100%;
	display:block;
	border:0;
}
/* 
CSS CONTEUDO POPUP
*/
#cboxOverlay {
	background:#fff;
}
#colorbox {
}
#cboxTopLeft {
	width:25px;
	height:25px;
	background:url(../imagens/colorbox/border1.png) no-repeat 0 0;
}
#cboxTopCenter {
	height:25px;
	background:url(../imagens/colorbox/border1.png) repeat-x 0 -50px;
}
#cboxTopRight {
	width:25px;
	height:25px;
	background:url(../imagens/colorbox/border1.png) no-repeat -25px 0;
}
#cboxBottomLeft {
	width:25px;
	height:25px;
	background:url(../imagens/colorbox/border1.png) no-repeat 0 -25px;
}
#cboxBottomCenter {
	height:25px;
	background:url(../imagens/colorbox/border1.png) repeat-x 0 -75px;
}
#cboxBottomRight {
	width:25px;
	height:25px;
	background:url(../imagens/colorbox/border1.png) no-repeat -25px -25px;
}
#cboxMiddleLeft {
	width:25px;
	background:url(../imagens/colorbox/border2.png) repeat-y 0 0;
}
#cboxMiddleRight {
	width:25px;
	background:url(../imagens/colorbox/border2.png) repeat-y -25px 0;
}
#cboxContent {
	background:#fff;
	overflow:hidden;
}
#cboxError {
	padding:50px;
	border:1px solid #ccc;
}
#cboxLoadedContent {
	margin-bottom:20px;
}
#cboxTitle {
	position:absolute;
	bottom:0px;
	left:0;
	text-align:center;
	width:100%;
	color:#999;
}
#cboxCurrent {
	position:absolute;
	bottom:0px;
	left:100px;
	color:#999;
}
#cboxSlideshow {
	position:absolute;
	bottom:0px;
	right:42px;
	color:#444;
}
#cboxPrevious {
	position:absolute;
	bottom:0px;
	left:0;
	color:#444;
}
#cboxNext {
	position:absolute;
	bottom:0px;
	left:63px;
	color:#444;
}
#cboxLoadingOverlay {
	background:#fff url(../imagens/colorbox/loading.gif) no-repeat 5px 5px;
}
#cboxClose {
	position:absolute;
	bottom:0;
	right:0;
	display:block;
	color:#444;
}
/*
FIX IE PNG
*/
.cboxIE #cboxTopLeft, .cboxIE #cboxTopCenter, .cboxIE #cboxTopRight, .cboxIE #cboxBottomLeft, .cboxIE #cboxBottomCenter, .cboxIE #cboxBottomRight, .cboxIE #cboxMiddleLeft, .cboxIE #cboxMiddleRight {
 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF, endColorstr=#00FFFFFF);
}
/*
  IE6 PNG
*/
.cboxIE6 #cboxTopLeft {
	background:url(../imagens/colorbox/ie6/borderTopLeft.png);
}
.cboxIE6 #cboxTopCenter {
	background:url(../imagens/colorbox/ie6/borderTopCenter.png);
}
.cboxIE6 #cboxTopRight {
	background:url(../imagens/colorbox/ie6/borderTopRight.png);
}
.cboxIE6 #cboxBottomLeft {
	background:url(../imagens/colorbox/ie6/borderBottomLeft.png);
}
.cboxIE6 #cboxBottomCenter {
	background:url(../imagens/colorbox/ie6/borderBottomCenter.png);
}
.cboxIE6 #cboxBottomRight {
	background:url(../imagens/colorbox/ie6/borderBottomRight.png);
}
.cboxIE6 #cboxMiddleLeft {
	background:url(../imagens/colorbox/ie6/borderMiddleLeft.png);
}
.cboxIE6 #cboxMiddleRight {
	background:url(../imagens/colorbox/ie6/borderMiddleRight.png);
}
.cboxIE6 #cboxTopLeft, .cboxIE6 #cboxTopCenter, .cboxIE6 #cboxTopRight, .cboxIE6 #cboxBottomLeft, .cboxIE6 #cboxBottomCenter, .cboxIE6 #cboxBottomRight, .cboxIE6 #cboxMiddleLeft, .cboxIE6 #cboxMiddleRight {
 _behavior: expression(this.src = this.src ? this.src : this.currentStyle.backgroundImage.split('"')[1], this.style.background = "none", this.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=" + this.src + ", sizingMethod='scale')");
}

    
.QOverlay {
	background-color: #000000;
	z-index: 9999;
}

.QLoader {
	background-color: #CCCCCC;
	height: 1px;
}

    Principais scripts desenvolvidas (JavaScript)

    //opacidade mouseover
function opacidade(obj, cond){
if(cond==1){
	document.getElementById(obj).style.opacity=1
} else { 
	document.getElementById(obj).style.opacity=.9
}
}

var envio_form=0;


    function validacampoobrigatorio(valor, tipovalidacao) {
// valor --> campo a ser validado
// tipovalidacao --> 0=global (sem focus no campo), 1=parcial (com focus no campo)
	if (valor.value.length == 0) {
		if (tipovalidacao == 1) valor.focus();
		valor.style.backgroundColor="#FFC";
		if (valor == form1.nome) {
			document.getElementById("info1").innerHTML = "o preenchimento do nome é obrigatório";
		} else if (valor == form1.apelido) {
			document.getElementById("info2").innerHTML = "o preenchimento do apelido é obrigatório";
		}else {
			document.getElementById("info5").innerHTML = "o preenchimento da morada é obrigatório";
		}
	} else {
		valor.style.backgroundColor="#3C0";
		if (tipovalidacao == 0) envio_form++;
	}
}

    function validanumero(valor, tipovalidacao) {
// valor --> campo a ser validado
// tipovalidacao --> 0=global (sem focus no campo), 1=parcial (com focus no campo)
	if (isNaN(valor.value) || valor.value < 18) {
		if (tipovalidacao == 1) {
			valor.focus();
			valor.select();
		}
		valor.style.backgroundColor="#FFC";
		document.getElementById("info3").innerHTML = "apenas para maiores de 18 anos";
	} else {
		valor.style.backgroundColor="#3C0";
		if (tipovalidacao == 0) envio_form++;
	}

}

    function validaemail(valor, tipovalidacao) {
// valor --> campo a ser validado
// tipovalidacao --> 0=global (sem focus no campo), 1=parcial (com focus no campo)
	if (valor.value.indexOf("@")==-1 || valor.value.length == 0) {
		if (tipovalidacao == 1) {
			valor.focus();
			valor.select();
		}
		valor.style.backgroundColor="#FFC";  
		document.getElementById("info4").innerHTML = "email inválido";
	} else {
		valor.style.backgroundColor="#3C0";
		if (tipovalidacao == 0) envio_form++;
	}
}

    function contacaract(numcaract, campovalor, idvalor) {
	var y=campovalor.value;
	document.getElementById(idvalor).innerHTML = (numcaract-y.length) + "/" + numcaract;
}

    function validacaoglobal() {
	validacampoobrigatorio(form1.primeironome, 0);
	validacampoobrigatorio(form1.apelido, 0);
	validacampoobrigatorio(form1.morada, 0);
	validanumero(form1.idade, 0);
	validaemail(form1.email, 0);
	if (!(document.getElementById("tecnologias_0").checked || document.getElementById("tecnologias_1").checked || document.getElementById("tecnologias_2").checked || document.getElementById("tecnologias_3").checked)) {
		document.getElementById("info6").innerHTML = "preencha uma das opções";
	} else {
		if (tipovalidacao == 0) envio_form++;
	}
	
	if (envio_form == 6) {
		envio_form = true;
	} else {
		envio_form = false;
	}
	return envio_form;
}

    function ajuda(campo) {
	switch (campo) {
		case 1:
			document.getElementById("info1").innerHTML = "coloque aqui o seu nome";
			break;
		case 2:
			document.getElementById("info4").innerHTML = "coloque aqui o seu e-mail";
			break;
		case 3:
			document.getElementById("info5").innerHTML = "coloque aqui a sua mensagem";
			break;
	
		default:
	}
}

    function limpaajuda() {
	for (i=1;i<7;i++) document.getElementById("info"+i).innerHTML = "";
}

    Integração com outras tecnologias

    var QueryLoader = {
	/*
	 * QueryLoader		Preload your site before displaying it!
	 * Author:			Gaya Kessler
	 * Date:			23-09-09
	 * URL:				http://www.gayadesign.com
	 * Version:			1.0
	 * 
	 * A simple jQuery powered preloader to load every image on the page and in the CSS
	 * before displaying the page to the user.
	 */
	
	overlay: "",
	loadBar: "",
	preloader: "",
	items: new Array(),
	doneStatus: 0,
	doneNow: 0,
	selectorPreload: "body",
	ieLoadFixTime: 2000,
	ieTimeout: "",
		
	init: function() {
		if (navigator.userAgent.match(/MSIE (\d+(?:\.\d+)+(?:b\d*)?)/) == "MSIE 6.0,6.0") {
			//break if IE6			
			return false;
		}
		if (QueryLoader.selectorPreload == "body") {
			QueryLoader.spawnLoader();
			QueryLoader.getImages(QueryLoader.selectorPreload);
			QueryLoader.createPreloading();
		} else {
			$(document).ready(function() {
				QueryLoader.spawnLoader();
				QueryLoader.getImages(QueryLoader.selectorPreload);
				QueryLoader.createPreloading();
			});
		}
		
		//help IE drown if it is trying to die :)
		QueryLoader.ieTimeout = setTimeout("QueryLoader.ieLoadFix()", QueryLoader.ieLoadFixTime);
	},
	
	ieLoadFix: function() {
		var ie = navigator.userAgent.match(/MSIE (\d+(?:\.\d+)+(?:b\d*)?)/);
		if (ie[0].match("MSIE")) {
			while ((100 / QueryLoader.doneStatus) * QueryLoader.doneNow < 100) {
				QueryLoader.imgCallback();
			}
		}
	},
	
	imgCallback: function() {
		QueryLoader.doneNow ++;
		QueryLoader.animateLoader();
	},
	
	getImages: function(selector) {
		var everything = $(selector).find("*:not(script)").each(function() {
			var url = "";
			
			if ($(this).css("background-image") != "none") {
				var url = $(this).css("background-image");
			} else if (typeof($(this).attr("src")) != "undefined" && $(this).attr("tagName").toLowerCase() == "img") {
				var url = $(this).attr("src");
			}
			
			url = url.replace("url(\"", "");
			url = url.replace("url(", "");
			url = url.replace("\")", "");
			url = url.replace(")", "");
			
			if (url.length > 0) {
				QueryLoader.items.push(url);
			}
		});
	},
	
	createPreloading: function() {
		QueryLoader.preloader = $("<div></div>").appendTo(QueryLoader.selectorPreload);
		$(QueryLoader.preloader).css({
			height: 	"0px",
			width:		"0px",
			overflow:	"hidden"
		});
		
		var length = QueryLoader.items.length; 
		QueryLoader.doneStatus = length;
		
		for (var i = 0; i < length; i++) {
			var imgLoad = $("<img></img>");
			$(imgLoad).attr("src", QueryLoader.items[i]);
			$(imgLoad).unbind("load");
			$(imgLoad).bind("load", function() {
				QueryLoader.imgCallback();
			});
			$(imgLoad).appendTo($(QueryLoader.preloader));
		}
	},

	spawnLoader: function() {
		if (QueryLoader.selectorPreload == "body") {
			var height = $(window).height();
			var width = $(window).width();
			var position = "fixed";
		} else {
			var height = $(QueryLoader.selectorPreload).outerHeight();
			var width = $(QueryLoader.selectorPreload).outerWidth();
			var position = "absolute";
		}
		var left = $(QueryLoader.selectorPreload).offset()['left'];
		var top = $(QueryLoader.selectorPreload).offset()['top'];
		
		QueryLoader.overlay = $("<div></div>").appendTo($(QueryLoader.selectorPreload));
		$(QueryLoader.overlay).addClass("QOverlay");
		$(QueryLoader.overlay).css({
			position: position,
			top: top,
			left: left,
			width: width + "px",
			height: height + "px"
		});
		
		QueryLoader.loadBar = $("<div></div>").appendTo($(QueryLoader.overlay));
		$(QueryLoader.loadBar).addClass("QLoader");
		
		$(QueryLoader.loadBar).css({
			position: "relative",
			top: "50%",
			width: "0%"
		});
	},
	
	animateLoader: function() {
		var perc = (100 / QueryLoader.doneStatus) * QueryLoader.doneNow;
		if (perc > 99) {
			$(QueryLoader.loadBar).stop().animate({
				width: perc + "%"
			}, 500, "linear", function() { 
				QueryLoader.doneLoad();
			});
		} else {
			$(QueryLoader.loadBar).stop().animate({
				width: perc + "%"
			}, 500, "linear", function() { });
		}
	},
	
	doneLoad: function() {
		//prevent IE from calling the fix
		clearTimeout(QueryLoader.ieTimeout);
		
		//determine the height of the preloader for the effect
		if (QueryLoader.selectorPreload == "body") {
			var height = $(window).height();
		} else {
			var height = $(QueryLoader.selectorPreload).outerHeight();
		}
		
		//The end animation, adjust to your likings
		$(QueryLoader.loadBar).animate({
			height: height + "px",
			top: 0
		}, 500, "linear", function() {
			$(QueryLoader.overlay).fadeOut(800);
			$(QueryLoader.preloader).remove();
		});
	}
}

    Soluções técnicas para problemas encontrados

    Consulta principalmente na pagina WEB w3shools

    Melhoramentos futuros

    Futuramente pretendemos melhor este site, ligando a uma base de dados mySQL / PHP, gerindo noticias de uma forma mais eficaz e mais eficiente.

    Conclusões

    Para o nosso projecto de protecção e segurança rodoviária realizado no âmbito da disciplina de Laboratório Multimédia 2, criamos um site com o principal objectivo de informar os condutores de todos os factores que afectam uma boa conduta na estrada. Os factores abordados foram: os efeitos das drogas na condução, entre eles o álcool e alguma drogas alucinogénas.Neste Website são disponibilizadas também estaticistas relativas aos acidentes nas estradas portuguesas nos últimos anos como forma de sensibilizar os utilizadores para a importância da prevenção.

    Sempre com o nosso público-alvo bem definido,os jovens que estão prestes a se tornarem condutores,os jovens/adultos que gostam de frequentar festas nocturnas/diurnas na qual existam bebidas alcoólicas, ou outro tipo de substâncias perigosas, finalizamos o nosso projecto aplicando os nossos conhecimentos de XHTML, CSS e JAVASCRIPT obtidos nas aulas práticas e teóricas e também aplicando outros conhecimentos obtidos através de pesquisas em prol do sucesso do nosso projecto. Aumentando assim os conhecimentos de todo o grupo envolvido.

    Referências bibliográficas

    Autoridade Nacional de Segurança Rodoviaria

    Wikipedia Portugal

    Facebook Developers

    w3schools

    Gaya Design

    Noupe.com

    Code Snippets

    choosedaily.com

    Anexos

    Retrieved from "http://wikis.ua.pt/labmm2/index.php?title=Protec%C3%A7%C3%A3o_e_Seguran%C3%A7a_Rodovi%C3%A1ria"
    • Personal tools
    Namespaces
    Variants
    Actions
    Navigation
    Toolbox