input,button,textarea,select{-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-border-radius:0px}input[type="checkbox"]{-webkit-appearance:checkbox;-moz-appearance:checkbox;appearance:checkbox}input[type="radio"]{-webkit-appearance:radio;-moz-appearance:radio;appearance:radio-button}
input[type="file"]{display:none}
<div class="uCanUpload">Загрузить файлы и бла бла бла</div>
<div class="file-upload"><label><input type="file" name="file"><span> /*изображение скрепки вставить либо прям тут либо через css :before*/ Загрузить файлы</span></label></div>
// Перехват файла с формы
var files = '', fileName = '';
// Получим данные файлов и добавим их в переменную
$(document).on('change', 'input[type=file]', function(){
var file = this.files[0];
fileName = $(this).val();
fileName = fileName.split('\\');
fileName = fileName[fileName.length - 1];
var reader = new FileReader();
reader.onload = function (e) {
files = e.target.result
};
reader.readAsDataURL(file);
if($('.fileName').length == 0) $('.file-upload').before('<div class="fileName"></div>');
$('.fileName').html(fileName+'<span id="delFile">X</span>');
});
$(document).on('click', '#delFile', function(){
var inp = $('input[type="file"]').clone();
$('input[type="file"]').before(inp).remove();
$('.fileName').remove();
});
function base64_encode(data) {
var b64 = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=';
var o1, o2, o3, h1, h2, h3, h4, bits, i = 0,
ac = 0,
enc = '',
tmp_arr = [];
if (!data) {
return data;
}
do { // pack three octets into four hexets
o1 = data.charCodeAt(i++);
o2 = data.charCodeAt(i++);
o3 = data.charCodeAt(i++);
bits = o1 << 16 | o2 << 8 | o3;
h1 = bits >> 18 & 0x3f;
h2 = bits >> 12 & 0x3f;
h3 = bits >> 6 & 0x3f;
h4 = bits & 0x3f;
// use hexets to index into b64, and append result to encoded string
tmp_arr[ac++] = b64.charAt(h1) + b64.charAt(h2) + b64.charAt(h3) + b64.charAt(h4);
} while (i < data.length);
enc = tmp_arr.join('');
var r = data.length % 3;
return (r ? enc.slice(0, r - 3) : enc) + '==='.slice(r || 3);
}
white-space:no-wrap; overflow:hidden; text-overflow:ellipsis;max-width:200px;
/*типа запрет ротации моб устройства*/
@media only screen and (min-width: 415px) and (max-width: 1279px) {
body{display:none} html:before{content:'Переверните устройство в портретный режим или откройте сайт с компьютера.';position:fixed;top:0;left:0;right:0;bottom:0;margin:auto;background:#fff;z-index:999;text-align:center;width:80%;height:100px}
}
var menuBtn = document.getElementById('menuBtn');
//Находим наш блок с меню
var menu = document.getElementById('menu');
var menuContainer = document.getElementById('menuContainer');
var menuIconClosed = "menu-icon closed"; //class name for closed button
var menuIconOpened = "menu-icon opened"; //class name for opened button
var menuContClosed = "menu-container closed"; //class name for closed menu
var menuContOpened = "menu-container opened"; //class name for opened menu
//Вешает клики на документ
//Проверяемклики в обертке для меню
menu.onclick = function(e) {
//Проверяем объект клика - если кнопка меню запускаем функцию
if(e.target == menuBtn) closeOrOpenMenu();
//Если клик был не на ссилке не делаем ничего
if(e.target.tagName != 'A') return;
else closeOrOpenMenu();//Иначе закрываем меню
//Функция для удобства
function closeOrOpenMenu(){
if (menuBtn.className == menuIconClosed) {
menuBtn.className = menuIconOpened;
menuContainer.className = menuContOpened;
} else if (menuBtn.className == menuIconOpened) {
menuBtn.className = menuIconClosed;
menuContainer.className = menuContClosed;
}
}
}
<!--Сделаем обертку для меню чтобы проверять клики только в ней-->
<div id="menu">
<span class="menu-icon closed" id="menuBtn"></span>
<div class="showMenu" id="menu"menu>Меню</div>
<nav class="menu-container closed" id="menuContainer">
<ul>
<li><a href="#gototop">Главная</a></li>
<li><a href="#ourservices">Услуги агентства</a></li>
<li><a href="#aboutus">О нас</a></li>
<li class="liNoAfter"><a href="#callus">Контакты</a></li>
<div class="myCellMobile">
<div class="myCellMargin">
<i class="fa fa-map-marker myFa"></i>
<p><span>г. Усть-Лабинск, ул.Октябрьская, 78</span><br />г. Краснодар, ул. Ставропольская 312 офис 8</p>
</div></div>
<div class="myCellMobile">
<div class="myCellMarginPhone">
<i class="fa fa-phone"></i>
<p class="ios_reset"><span class="nonono">+7 (918) 344-10-05</span><br />info@ricit.ru</p>
</div></div>
<li class="forcall"><span class="modal_btn">Заказать звонок</span></li>
</ul>
</nav>
</div>