html {
background: url(https://hsto.org/files/32f/eea/47c/32feea47cf134e02be7c55bcc9240b46.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}$(document).ready(function(){
$('#menu').click(function(){
$('#thumb').slideToggle('slow');
});
$('li img').click(function(){
var imgbg = $(this).attr('dir');
//console.log(imgbg);
$('#bg').css({backgroundImage: "url("+imgbg+")"});
});
$('#bgimage').click(function(){
$('#thumb').hide();
});
});#mhead{
color:#000;
border: 1px solid #e3e3e3;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
text-align: center;
font-family: georgia;
}
#container{
width: 400px;
height: 400px;}
ul{
list-style:none;
margin:0;
padding:0;
}
li{
float:left;
padding:5px;
border:solid #666 0;
cursor: pointer;
}
#menu{ cursor:pointer;
position:absolute;
z-index: 10;
}
#thumb{
margin-top: 40px;
width:290px;
height:285px;
color:#000;
box-shadow:0 0 10px #CCC;
z-index:9999;
border:solid #CCC 1px;
overflow:hidden;
position:absolute;
display:none;
}
#bgimage{
position:fixed;
top:0; left:0;
width:100%;
height:100%;
z-index:1;
}
#bg{background-image:url(images/1.jpg);background-size:100% auto;}<!DOCTYPE HTML>
<html>
<head>
<title>Background image change onclick using jQuery - InfoTuts</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="script.js"></script>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body id="bg">
<div id="bgimage"></div>
<div id="mhead"> <h2>Background image change onclick using jQuery - InfoTuts</h2></div>
<div id="menu"><img src="images/bgclick.png"></div>
<div id="thumb">
<ul>
<li><img src="images/1.jpg" width="85" height="82" dir="images/1.jpg"></li>
<li><img src="images/2.jpg" width="85" height="82" dir="images/2.jpg"></li>
<li><img src="images/3.jpg" width="85" height="82" dir="images/3.jpg"></li>
<li><img src="images/4.jpg" width="85" height="82" dir="images/4.jpg"></li>
<li><img src="images/5.jpg" width="85" height="82" dir="images/5.jpg"></li>
<li><img src="images/6.jpg" width="85" height="82" dir="images/6.jpg"></li>
<li><img src="images/7.jpg" width="85" height="82" dir="images/7.jpg"></li>
<li><img src="images/8.jpg" width="85" height="82" dir="images/8.jpg"></li>
<li><img src="images/9.jpg" width="85" height="82" dir="images/9.jpg"></li>
</ul>
</div>
</body>
</html><button onclick="function();">.
Используется для группирования заголовков веб-страницы или раздела. Внутри располагаются теги заголовков от до . Данный тег исключён из версии HTML от W3C, но остался в версии WHATWG, будущее элемента пока не определено.
Тег задает «шапку» сайта или раздела, в которой обычно располагается заголовок.
<form method="post">
<input type="text" name="phone">
<input type="submit">
</form><?php
if(($_POST['phone']) and (is_numeric($_POST['phone']))
mail("mail@example.com", "New Phone: ".$_POST['phone'], $_POST['phone']);
?><form action="send.php". В файле используйте mail() (php.net/manual/ru/function.mail.php). Либо организуйте запрос используя ajax.<form method=POST class="form_s center-block">
<div class="form-group">
<input type="text" class="form-control" required="required" placeholder="Имя" name="name">
</div>
<div class="form-group">
<input type="text" class="form-control" required="required" placeholder="e-mail" name="mail">
</div>
<div class="form-group">
<input type="text" class="form-control" required="required" placeholder="телефон" name="phone">
</div>
<button type="submit" class="btn btn-primary btn-block">ОТПРАВИТЬ ЗАЯВКУ И СКАЧАТЬ АНКЕТУ УЧАСТНИКА</button>
</form><?php
$msg = 'Имя: '.$_POST['name']."\r\n E-mail: ".$_POST['mail']."\r\n Телефон: ".$_POST['phone'];
mail("paliki@mail.ru", "Новая заявка!", $msg);
echo '<div class="укажитеклассздесь">Заявка успешно отправлена!</div>';
?>