![[Tutorial]Criando seu Site de WoW #2 Empty](https://2img.net/i/empty.gif)
Aula #2 Creditos - Fox - t[]b@_$ERB|@ Nome - Concluindo as paginas PHP Proxima aula - [Tens de ter uma conta e sessão iniciada para poderes visualizar este link]Hoje vamos elaborar a pagina Obrigado.php, e a pagina erro.php.
Crie um novo projeto e adicione o seguinte código
Código:
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title><?php echo $site_name ?></title>
<link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
</head>
<body>
<h1><?php echo $site_name ?></h1>
<form action="" method="get" name="error" class="general" id="error">
Obrigado por se registrar.
</form>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script>
$(function(){
if( $.browser.msie && $.browser.version < 9 ) {
$('html').addClass('ie');
$('div.option-group').each(function(){
var $this = $(this);
$this.find('label').append('<span class="before"></span> <span class="after"></span>');
// botão radio
if( $this.hasClass('radio') ) {
$this.delegate('input[type="radio"]', 'click', function(){
if( this.checked ) {
$(this).siblings('label').removeClass('checked').end().next('label').addClass('checked');
}
else {
$(this).next('label').removeClass('checked');
}
});
}
// Aplica o stilo na chekbox
else if( $this.hasClass('check') ) {
$this.delegate('input[type="checkbox"]', 'click', function(){
if( this.checked ) {
$(this).next('label').addClass('checked');
}
else {
$(this).next('label').removeClass('checked');
}
});
}
});
}
// seleciona a box do radio
if( $.browser.msie && $.browser.version <= 9 ) {
$('html').addClass('ie9');
$('form.general')
.find('select')
.css({ 'opacity': '0', 'position': 'relative', 'z-index': '10' })
.after('<span class="selectTop"/>')
.change(function(){
$(this).next().text( $('option:selected', this).text() );
})
.trigger('change');
}
// adiciona 'invalid' em caso do html5 der fail.
if( !$.browser.firefox ) {
$('form.general').each(function(){
$(this).find('input.form-input').bind('invalid', function(){
$(this).addClass('invalid');
});
});
}
});
</script>
</body>
</html>Salve-o, dentro da pasta Include, como "obrigado.html"
Abra um novo projeto, e adicione o seguinte código.
Código:
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title><?php echo $site_name ?></title>
<link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
</head>
<body>
<h1><?php echo $site_name ?></h1>
<form action="" method="get" name="error" class="general" id="error">
Ocorreu algum erro no seu registro, tente novamente.
</form>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script>
$(function(){
if( $.browser.msie && $.browser.version < 9 ) {
$('html').addClass('ie');
$('div.option-group').each(function(){
var $this = $(this);
$this.find('label').append('<span class="before"></span> <span class="after"></span>');
// botão radio
if( $this.hasClass('radio') ) {
$this.delegate('input[type="radio"]', 'click', function(){
if( this.checked ) {
$(this).siblings('label').removeClass('checked').end().next('label').addClass('checked');
}
else {
$(this).next('label').removeClass('checked');
}
});
}
// estilo da checkbox
else if( $this.hasClass('check') ) {
$this.delegate('input[type="checkbox"]', 'click', function(){
if( this.checked ) {
$(this).next('label').addClass('checked');
}
else {
$(this).next('label').removeClass('checked');
}
});
}
});
}
// seleciona o estilo da box
if( $.browser.msie && $.browser.version <= 9 ) {
$('html').addClass('ie9');
$('form.general')
.find('select')
.css({ 'opacity': '0', 'position': 'relative', 'z-index': '10' })
.after('<span class="selectTop"/>')
.change(function(){
$(this).next().text( $('option:selected', this).text() );
})
.trigger('change');
}
// adiciona 'invalido' caso der fail no html5
if( !$.browser.firefox ) {
$('form.general').each(function(){
$(this).find('input.form-input').bind('invalid', function(){
$(this).addClass('invalid');
});
});
}
});
</script>
</body>
</html>Salve-o como error.php .
Pronto,
as paginas de sucesso e sem sucesso foram adicionadas.
na nossa proxima aula vamos adicionar o css que fará o "DESIGN" da nossa pagina.
Até mais.
![[Tutorial]Criando seu Site de WoW #2 2309760014](/users/3014/60/05/24/smiles/2309760014.png)