Monthly Archives: Июль 2017

Модальное окно

.modal-window {
    position: fixed;
    z-index: 10000;
    width: 100%;
    top: 0;
    left: 0;
    display: none; 
    height: 100%;
    background: rgba(255, 255, 255, 0.50);
}

.modal-windows-form {
    width: 390px;
    height: 360px;
    background-color: white;
    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.2);
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    padding: 0px 80px;
    box-sizing: border-box;
}

.modal-windows-form h2 {
    width: 100%;
    text-align: center;
    margin: 20px 0px;
    font-size: 22px;
}

.modal-windows-form input[type="text"] {
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: none;
    background: #e6e7e8;
    color: black;
    padding: 5px 10px;
    font-size: 14px;
    margin-bottom: 10px;
    border-radius: 5px;
}

.modal-windows-form span {
    font-size: 14px;
    text-align: justify;
    margin-left: 10px;
}

.modal-windows-form textarea {
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: none;
    background: #e6e7e8;
    color: black;
    resize: none;
    height: 90px;
    padding: 5px 10px;
    font-size: 14px;
    margin-bottom: 10px;
    border-radius: 5px;
}

.modal-windows-form input[type="submit"] {
    border: none;
    background: #f9690e;
    color: white;
    width: 160px;
    margin: auto;
    display: block;
    height: 35px;
    margin-top: 20px;
    font-size: 16px;
    cursor: pointer;
    transition: 0.3s;
    border-radius: 5px;
}

.modal-windows-form input[type="submit"]:hover {
    background: #4ecdc4;
}

.modal-windows-form input[type="checkbox"] {
    display: inline-block;
}

button#form-close {
    border: none;
    outline: none;
    background: transparent;
    display: block;
    width: 10px;
    height: 10px;
    padding: 0;
    margin: 0;
    cursor: pointer;
    position: absolute;
    right: 10px;
    top: 10px;
    background-size: 10px;
    background-image: url(../img/cross.svg);
}

100

101

102

103

104

105

106

.modal-window {

position: fixed;

z-index: 10000;

width: 100%;

top: 0;

left: 0;

display: none;

height: 100%;

background: rgba(255, 255, 255, 0.50);

}

.modal-windows-form {

width: 390px;

height: 360px;

background-color: white;

box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.2);

position: absolute;

left: 0;

right: 0;

top: 0;

bottom: 0;

margin: auto;

padding: 0px 80px;

box-sizing: border-box;

}

.modal-windows-form h2 {

width: 100%;

text-align: center;

margin: 20px 0px;

font-size: 22px;

}

.modal-windows-form input[type="text"] {

width: 100%;

-webkit-box-sizing: border-box;

box-sizing: border-box;

border: none;

background: #e6e7e8;

color: black;

padding: 5px 10px;

font-size: 14px;

margin-bottom: 10px;

border-radius: 5px;

}

.modal-windows-form span {

font-size: 14px;

text-align: justify;

margin-left: 10px;

}

.modal-windows-form textarea {

width: 100%;

-webkit-box-sizing: border-box;

box-sizing: border-box;

border: none;

background: #e6e7e8;

color: black;

resize: none;

height: 90px;

padding: 5px 10px;

font-size: 14px;

margin-bottom: 10px;

border-radius: 5px;

}

.modal-windows-form input[type="submit"] {

border: none;

background: #f9690e;

color: white;

width: 160px;

margin: auto;

display: block;

height: 35px;

margin-top: 20px;

font-size: 16px;

cursor: pointer;

transition: 0.3s;

border-radius: 5px;

}

.modal-windows-form input[type="submit"]:hover {

background: #4ecdc4;

}

.modal-windows-form input[type="checkbox"] {

display: inline-block;

}

button#form-close {

border: none;

outline: none;

background: transparent;

display: block;

width: 10px;

height: 10px;

padding: 0;

margin: 0;

cursor: pointer;

position: absolute;

right: 10px;

top: 10px;

background-size: 10px;

background-image: url(../img/cross.svg);

}

<div class="modal-window">
	<div class="modal-windows-form">
		<button id="form-close"></button> 
		<h2>Оставить заявку</h2> 
		<form>
			<input type="text" name="username" value="" placeholder="Имя"> 
			<input type="text" name="phone" value="" placeholder="Телефон"> 
			<textarea placeholder="Сообщение"></textarea>
			<input type="checkbox" name="personalInfo">
			<span>Я подтверждаю согласие на обработку <a href="#" rel="nofollow" class="super_url">персональных данных</a> </span>
			<input type="submit" name="submit" value="Отправить">
		</form>
	</div>
</div>

<h2>Оставить заявку</h2>

<form>

<span>Я подтверждаю согласие на обработку <a href="#" rel="nofollow" class="super_url">персональных данных</a> </span>

</form>

</div>

  $(document).on('click', '.send-letter', function(){
    $('.modal-window').show();
  });

  $(document).on('click', '#form-close', function(){
    $('.modal-window').hide();
  });

$(document).on('click', '.send-letter', function(){

$('.modal-window').show();

});

$(document).on('click', '#form-close', function(){

$('.modal-window').hide();

});

Отправить запрос POST на php

$url = 'http://localhost/post.php';
$params = array(
    'param1' => '123', // в http://localhost/post.php это будет $_POST['param1'] == '123'
    'param2' => 'abc', // в http://localhost/post.php это будет $_POST['param2'] == 'abc'
);
$result = file_get_contents($url, false, stream_context_create(array(
    'http' => array(
        'method'  => 'POST',
        'header'  => 'Content-type: application/x-www-form-urlencoded',
        'content' => http_build_query($params)
    )
)));

echo $result;

$url = 'http://localhost/post.php';

$params = array(

'param1' => '123', // в http://localhost/post.php это будет $_POST['param1'] == '123'

'param2' => 'abc', // в http://localhost/post.php это будет $_POST['param2'] == 'abc'

);

$result = file_get_contents($url, false, stream_context_create(array(

'http' => array(

'method' => 'POST',

'header' => 'Content-type: application/x-www-form-urlencoded',

'content' => http_build_query($params)

)

)));

echo $result;

Получить значение select option js/jquery

element = document.getElementById("brone_operators_id");
result = element.options[element.selectedIndex].text;
console.log(result);

element = document.getElementById("brone_operators_id");

result = element.options[element.selectedIndex].text;

console.log(result);

jQuery

result = $("select#brone_operators_id option:selected").text();
console.log(result);

1 2	result = $("select#brone_operators_id option:selected").text(); console.log(result);

Ссылка на сайт при копировании контента

function defCopySite() {
    var istS = 'Узнайте больше на сайте:'; // Слово должно находится в кавычках!
    var copyR = '© matveevs.ru'; // Слово должно находится в кавычках!
    var body_element = document.getElementsByTagName('body')[0];
    var choose = window.getSelection();
    var myLink = document.location.href;
    var authorLink = "<br /><br />" + istS + ' ' + "<a href='" + myLink + "'>" + myLink + "</a><br />" + copyR;
    var copytext = choose + authorLink;
    var addDiv = document.createElement('div');
    addDiv.style.position = 'absolute';
    addDiv.style.left = '-99999px';
    body_element.appendChild(addDiv);
    addDiv.innerHTML = copytext;
    choose.selectAllChildren(addDiv);
    window.setTimeout(function() {
        body_element.removeChild(addDiv);
    }, 0);
}
document.oncopy = defCopySite;

function defCopySite() {

var istS = 'Узнайте больше на сайте:'; // Слово должно находится в кавычках!

var body_element = document.getElementsByTagName('body')[0];

var choose = window.getSelection();

var myLink = document.location.href;

var authorLink = "<br /><br />" + istS + ' ' + "<a href='" + myLink + "'>" + myLink + "</a><br />" + copyR;

var copytext = choose + authorLink;

var addDiv = document.createElement('div');

addDiv.style.position = 'absolute';

addDiv.style.left = '-99999px';

body_element.appendChild(addDiv);

addDiv.innerHTML = copytext;

choose.selectAllChildren(addDiv);

window.setTimeout(function() {

body_element.removeChild(addDiv);

}, 0);

}

document.oncopy = defCopySite;

Убрать стрелки input number

input[type='number'] {
    -moz-appearance:textfield;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
}

input[type='number'] {

-moz-appearance:textfield;

}

input::-webkit-outer-spin-button,

input::-webkit-inner-spin-button {

-webkit-appearance: none;

}

Проверка формы js и отправка

	$(document).on('click', '#send_form_callback', function() {

		$name = checkString('input[name="form_text_6"]');
		$phone = checkString('input[name="form_text_7"]');
		$email = checkString('input[name="form_email_8"]');
		$comment = checkString('textarea[name="form_textarea_9"]');

		if ($name && $phone && $email && $comment) {
			$('form[name="request_call"] input[name="web_form_submit"]').click();
		}

	});


	function checkString(id) {

	    var item = $(id);
	    if (item.val() == '') {
	        item.css('border', '2px solid #da6060');
	        event.preventDefault();
	        return false;
	    } else {
	        item.css('border', '2px solid #2b9619');
	        return true;
	    }
	}

$(document).on('click', '#send_form_callback', function() {

$name = checkString('input[name="form_text_6"]');

$phone = checkString('input[name="form_text_7"]');

$email = checkString('input[name="form_email_8"]');

$comment = checkString('textarea[name="form_textarea_9"]');

if ($name && $phone && $email && $comment) {

$('form[name="request_call"] input[name="web_form_submit"]').click();

}

});

function checkString(id) {

var item = $(id);

if (item.val() == '') {

item.css('border', '2px solid #da6060');

event.preventDefault();

return false;

} else {

item.css('border', '2px solid #2b9619');

return true;

}

ЧПУ bitrix

ЧПУ Битрикс urlrewrite.php

array(
		"CONDITION" => "#^/katalog/([a-z0-9\-]+)/([a-z0-9\-]+)/([a-z0-9\-]+)#",
		"RULE" => "SECTION_CODE_PATH=$3",
		"ID" => "bitrix:catalog.section.list",
		"PATH" => "/katalog/detail.php",
	),

	array(
		"CONDITION" => "#^/katalog/([a-z0-9\-]+)/([a-z0-9\-]+)#",
		"RULE" => "SECTION_CODE_PATH=$2",
		"ID" => "bitrix:catalog.section.list",
		"PATH" => "/katalog/list.php",
	),

	array(
		"CONDITION" => "#^/katalog/([A-z,0-9]+)#",
		"RULE" => "SECTION_CODE_PATH=$1",
		"ID" => "bitrix:catalog.section.list",
		"PATH" => "/katalog/index.php",
	),

array(

"CONDITION" => "#^/katalog/([a-z0-9\-]+)/([a-z0-9\-]+)/([a-z0-9\-]+)#",

"RULE" => "SECTION_CODE_PATH=$3",

"ID" => "bitrix:catalog.section.list",

"PATH" => "/katalog/detail.php",

array(

"CONDITION" => "#^/katalog/([a-z0-9\-]+)/([a-z0-9\-]+)#",

"RULE" => "SECTION_CODE_PATH=$2",

"ID" => "bitrix:catalog.section.list",

"PATH" => "/katalog/list.php",

array(

"CONDITION" => "#^/katalog/([A-z,0-9]+)#",

"RULE" => "SECTION_CODE_PATH=$1",

"ID" => "bitrix:catalog.section.list",

"PATH" => "/katalog/index.php",