Category Archives: Web

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

.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 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;

Убрать стрелки 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;

}

Проверка формы js

        /* check form START */

        $("input[name=form_text_2]").mask("+7 (999) 999-9999");

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

            checkInput('input[name="form_text_1"]', 'string');
            checkInput('input[name="form_text_2"]', 'phone');
            checkInput('input[name="form_text_3"]', 'string');
        });

        function checkInput(id, type) {

            switch (type) {
                case 'string':
                    checkString(id);
                    break;
                case 'email':
                    checkEmail(id);
                    break;
                case 'phone':
                    checkPhone(id);
                    break;
            }

        }

        function checkString(id) {

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

        function checkEmail(id) {

            var item = $(id);
            var result = isValidEmail(id);

            if (result === false) {
                item.css('border', '1px solid #da6060');
                event.preventDefault();
            } else if (result === true) {
                item.css('border', '1px solid #2b9619');
            }
        }

        function isValidEmail(id) {

            var string = $(id).val();

            var atSym = string.lastIndexOf("@");
            var space = string.lastIndexOf(" ");
            if (space > 1) {
                return false;
            }
            if (atSym < 1) {
                return false;
            }
            if (atSym == string.length - 1) {
                return false;
            }
            if (atSym > 64) {
                return false;
            }
            if (string.length - atSym > 255) {
                return false;
            }
            var lastDot = string.lastIndexOf(".");
            if (lastDot > atSym + 1 && lastDot < string.length - 1) {
                return true;
            }
            if (string.charAt(atSym + 1) == '[' && string.charAt(string.length - 1) == ']') {
                return true;
            }
            return false;
        }

        function checkPhone(id) {
            var item = $(id);
            phone = item.val();
            phone = phone.slice(2);
            phone = phone.match(/^\([0-9]{3}\)[0-9]{3}-[0-9]{2}\-[0-9]{2}/);

            if (!phone) {
                item.css('border', '1px solid #da6060');
                event.preventDefault();
            } else {
                item.css('border', '1px solid #2b9619');
            }
        }

        /* check form END */

/* check form START */

$("input[name=form_text_2]").mask("+7 (999) 999-9999");

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

checkInput('input[name="form_text_1"]', 'string');

checkInput('input[name="form_text_2"]', 'phone');

checkInput('input[name="form_text_3"]', 'string');

});

function checkInput(id, type) {

switch (type) {

case 'string':

checkString(id);

break;

case 'email':

checkEmail(id);

break;

case 'phone':

checkPhone(id);

break;

}

function checkString(id) {

var item = $(id);

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

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

event.preventDefault();

} else {

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

}

function checkEmail(id) {

var item = $(id);

var result = isValidEmail(id);

if (result === false) {

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

event.preventDefault();

} else if (result === true) {

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

}

function isValidEmail(id) {

var string = $(id).val();

var atSym = string.lastIndexOf("@");

var space = string.lastIndexOf(" ");

if (space > 1) {

return false;

}

if (atSym < 1) {

return false;

}

if (atSym == string.length - 1) {

return false;

}

if (atSym > 64) {

return false;

}

if (string.length - atSym > 255) {

return false;

}

var lastDot = string.lastIndexOf(".");

if (lastDot > atSym + 1 && lastDot < string.length - 1) {

return true;

}

if (string.charAt(atSym + 1) == '[' && string.charAt(string.length - 1) == ']') {

return true;

}

return false;

}

function checkPhone(id) {

var item = $(id);

phone = item.val();

phone = phone.slice(2);

phone = phone.match(/^$[0-9]{3}$[0-9]{3}-[0-9]{2}\-[0-9]{2}/);

if (!phone) {

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

event.preventDefault();

} else {

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

}

/* check form END */

Принудительная очистка кеша php

В index.php в самый вверх вставить

Header("Last-Modified: " . gmdate("D, d M Y H:i:s", strtotime("-1 day")) . " GMT");
Header("Content-Type: text/html; charset=utf-8");
if (!empty($_SERVER['SERVER_SOFTWARE']) && strstr($_SERVER['SERVER_SOFTWARE'], 'Apache/2')) {
    Header("Cache-Control: no-cache, pre-check=0, post-check=0");
} else {
    Header("Cache-Control: private, pre-check=0, post-check=0, max-age=0");
}
Header("Expires: 0");
Header("Pragma: no-cache");

Header("Last-Modified: " . gmdate("D, d M Y H:i:s", strtotime("-1 day")) . " GMT");

Header("Content-Type: text/html; charset=utf-8");

if (!empty($_SERVER['SERVER_SOFTWARE']) && strstr($_SERVER['SERVER_SOFTWARE'], 'Apache/2')) {

Header("Cache-Control: no-cache, pre-check=0, post-check=0");

} else {

Header("Cache-Control: private, pre-check=0, post-check=0, max-age=0");

}

Header("Expires: 0");

Header("Pragma: no-cache");

Замена ссылки JS (jQuery)

Для замены ссылки с помощью JS (jQuery) используем attr

function spbMenu() {
    $('[href="/promo/"]').attr('href','/promo-spb/');
    $('[href="/blog/"]').attr('href','/blog-spb/');
};

function spbMenu() {

$('[href="/promo/"]').attr('href','/promo-spb/');

$('[href="/blog/"]').attr('href','/blog-spb/');

};

Затем вызываем функцию

spbMenu();

1	spbMenu();

Геолокация php

class IPGeoBase
{
    private $fhandleCIDR, $fhandleCities, $fSizeCIDR, $fsizeCities;

    /*
     * @brief Конструктор
     *
     * @param CIDRFile файл базы диапазонов IP (cidr_optim.txt)
     * @param CitiesFile файл базы городов (cities.txt)
     */
    public function __construct($CIDRFile = false, $CitiesFile = false)
    {
        if (!$CIDRFile) {
            $CIDRFile = dirname(__FILE__) . '/cidr_optim.txt';
        }
        if (!$CitiesFile) {
            $CitiesFile = dirname(__FILE__) . '/cities.txt';
        }
        $this->fhandleCIDR   = fopen($CIDRFile, 'r') or die("Cannot open $CIDRFile");
        $this->fhandleCities = fopen($CitiesFile, 'r') or die("Cannot open $CitiesFile");
        $this->fSizeCIDR     = filesize($CIDRFile);
        $this->fsizeCities   = filesize($CitiesFile);
    }

    /*
     * @brief Получение информации о городе по индексу
     * @param idx индекс города
     * @return массив или false, если не найдено
     */
    private function getCityByIdx($idx)
    {
        rewind($this->fhandleCities);
        while (!feof($this->fhandleCities)) {
            $str      = fgets($this->fhandleCities);
            $arRecord = explode("\t", trim($str));
            if ($arRecord[0] == $idx) {
                return array('city' => $arRecord[1],
                    'region'            => $arRecord[2],
                    'district'          => $arRecord[3],
                    'lat'               => $arRecord[4],
                    'lng'               => $arRecord[5]);
            }
        }
        return false;
    }

    /*
     * @brief Получение гео-информации по IP
     * @param ip IPv4-адрес
     * @return массив или false, если не найдено
     */
    public function getRecord($ip)
    {
        $ip = sprintf('%u', ip2long($ip));

        rewind($this->fhandleCIDR);
        $rad = floor($this->fSizeCIDR / 2);
        $pos = $rad;
        while (fseek($this->fhandleCIDR, $pos, SEEK_SET) != -1) {
            if ($rad) {
                $str = fgets($this->fhandleCIDR);
            } else {
                rewind($this->fhandleCIDR);
            }

            $str = fgets($this->fhandleCIDR);

            if (!$str) {
                return false;
            }

            $arRecord = explode("\t", trim($str));

            $rad = floor($rad / 2);
            if (!$rad && ($ip < $arRecord[0] || $ip > $arRecord[1])) {
                return false;
            }

            if ($ip < $arRecord[0]) {
                $pos -= $rad;
            } elseif ($ip > $arRecord[1]) {
                $pos += $rad;
            } else {
                $result = array('range' => $arRecord[2], 'cc' => $arRecord[3]);

                if ($arRecord[4] != '-' && $cityResult = $this->getCityByIdx($arRecord[4])) {
                    $result += $cityResult;
                }

                return $result;
            }
        }
        return false;
    }
}

class IPGeoBase

{

private $fhandleCIDR, $fhandleCities, $fSizeCIDR, $fsizeCities;

* @brief Конструктор

* @param CIDRFile файл базы диапазонов IP (cidr_optim.txt)

* @param CitiesFile файл базы городов (cities.txt)

public function __construct($CIDRFile = false, $CitiesFile = false)

{

if (!$CIDRFile) {

$CIDRFile = dirname(__FILE__) . '/cidr_optim.txt';

}

if (!$CitiesFile) {

$CitiesFile = dirname(__FILE__) . '/cities.txt';

}

$this->fhandleCIDR = fopen($CIDRFile, 'r') or die("Cannot open $CIDRFile");

$this->fhandleCities = fopen($CitiesFile, 'r') or die("Cannot open $CitiesFile");

$this->fSizeCIDR = filesize($CIDRFile);

$this->fsizeCities = filesize($CitiesFile);

}

* @brief Получение информации о городе по индексу

* @param idx индекс города

* @return массив или false, если не найдено

private function getCityByIdx($idx)

{

rewind($this->fhandleCities);

while (!feof($this->fhandleCities)) {

$str = fgets($this->fhandleCities);

$arRecord = explode("\t", trim($str));

if ($arRecord[0] == $idx) {

return array('city' => $arRecord[1],

'region' => $arRecord[2],

'district' => $arRecord[3],

'lat' => $arRecord[4],

'lng' => $arRecord[5]);

}

return false;

}

* @brief Получение гео-информации по IP

* @param ip IPv4-адрес

* @return массив или false, если не найдено

public function getRecord($ip)

{

$ip = sprintf('%u', ip2long($ip));

rewind($this->fhandleCIDR);

$rad = floor($this->fSizeCIDR / 2);

$pos = $rad;

while (fseek($this->fhandleCIDR, $pos, SEEK_SET) != -1) {

if ($rad) {

$str = fgets($this->fhandleCIDR);

} else {

rewind($this->fhandleCIDR);

}

$str = fgets($this->fhandleCIDR);

if (!$str) {

return false;

}

$arRecord = explode("\t", trim($str));

$rad = floor($rad / 2);

if (!$rad && ($ip < $arRecord[0] || $ip > $arRecord[1])) {

return false;

}

if ($ip < $arRecord[0]) {

$pos -= $rad;

} elseif ($ip > $arRecord[1]) {

$pos += $rad;

} else {

$result = array('range' => $arRecord[2], 'cc' => $arRecord[3]);

if ($arRecord[4] != '-' && $cityResult = $this->getCityByIdx($arRecord[4])) {

$result += $cityResult;

}

return $result;

}

return false;

}

public function myGeoIp()
    {

        $gb = new IPGeoBase();

        if ($_SERVER['HTTP_FORWARDED']) {
            $data = $gb->getRecord(substr($_SERVER["HTTP_FORWARDED"], 4));
        } else {
            $data = $gb->getRecord($_SERVER["REMOTE_ADDR"]);
        }

        $msk = array(
            "Москва",
            "Московская область",
        );

        $spb = array(
            "Санкт-Петербург",
            "Ленинградская область",
        );

        $data['region'] = iconv('windows-1251', 'UTF-8', $data['region']);

        if (in_array($data['region'], $spb)) {

            $result = 'SPB';

        } elseif (in_array($data['region'], $msk)) {

            $result = 'MSK';

        } else {

            $result = 'RUS';

        }

        return $result;
    }

public function myGeoIp()

{

$gb = new IPGeoBase();

if ($_SERVER['HTTP_FORWARDED']) {

$data = $gb->getRecord(substr($_SERVER["HTTP_FORWARDED"], 4));

} else {

$data = $gb->getRecord($_SERVER["REMOTE_ADDR"]);

}

$msk = array(

"Москва",

"Московская область",

);

$spb = array(

"Санкт-Петербург",

"Ленинградская область",

);

$data['region'] = iconv('windows-1251', 'UTF-8', $data['region']);

if (in_array($data['region'], $spb)) {

$result = 'SPB';

} elseif (in_array($data['region'], $msk)) {

$result = 'MSK';

} else {

$result = 'RUS';

}

return $result;

}

Скачать файл geoIP cites — Города cide_optim — IP и соответствие их к региону/Городу