Скрипт для защиты картинок от скачивания

18.02.2016 11:06:21

На самом деле запретить скачивание картинки нельзя, поэтому данный пример, просто создается слой поверх картинки, блокируя "скачать" из контекстного меню по правой кнопке мыши.

Javascript создает div, который перекрывает картинку.

html.html (Download)

 	<div class="pic coveredPic">
		<img src="<?=$sPath?>/small/<?=$item->pic?>" alt="<?=$this->escape($item->)?>" />
	</div>

css.css (Download)

 .coveredPic {
	position: relative;
}

.coveredPic img
{
	z-index: 10;
/*	position: absolute;*/
	top: 0px;
	left: 0px;
}

.coveredPic .cover
{
	z-index: 11;
	position: relative;
	top: 0px;
	left: 0px;
	margin-bottom: 10px;
}

js.js (Download)

 		$(".coveredPic").each(function(){
			$("img", $(this)).on("load", function(){
				var elImg = $(this),
					height = elImg.height()+10,
					width = elImg.width()+10,
					sDiv = '<div class="cover" style="height: '+height+'px; width: '+width+'px"></div>';
				;
				elImg.after( sDiv ).css({position: "absolute"});
			});
			
		});


Категории: JavaScript
Яндекс.Метрика