Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 06.03.2012, 16:42
Интересующийся
Отправить личное сообщение для Kaba Посмотреть профиль Найти все сообщения от Kaba
 
Регистрация: 18.10.2011
Сообщений: 19

В Хроме не работает функция
Есть функция которая попиксельно обрабатывает изображения и выдает необходимый результат (ч/б, сепия и т.п.).

Во всех браузерах корректное отображение результата (Firefox 7+, для IE пришлось использовать фильтры), кроме Google Chrome.
Не знаю в чем дело, но вместо необходимого изображения выводится пустота. Если кто сталкивался с такой проблемой, подскажите в чем может быть загвоздка.

И пример самого JS кода:

<script type="text/javascript"> 
function grayscale(image, bPlaceImage){
	var myCanvas=document.createElement("canvas");
	var myCanvasContext=myCanvas.getContext("2d");
	
	var imgWidth=image.width;
	var imgHeight=image.height;
	myCanvas.width= imgWidth;
	myCanvas.height=imgHeight;
	
	myCanvasContext.drawImage(image,0,0);
	
	var imageData=myCanvasContext.getImageData(0,0, imgWidth, imgHeight);

	
	for(i=0; i<imageData.height; i++){
		for(j=0; j<imageData.width; j++){
			var index=(i*4)*imageData.width+(j*4);
			var red=imageData.data[index];	  
			var green=imageData.data[index+1];
			var blue=imageData.data[index+2];	  
			var alpha=imageData.data[index+3];	 
			var average=(red+green+blue)*0.3333; 	  
			
			imageData.data[index]=average;
			imageData.data[index+1]=average;
			imageData.data[index+2]=average;
			imageData.data[index+3]=alpha;
		}
	}
	
	myCanvasContext.putImageData(imageData,0,0,0,0, 
	imageData.width, imageData.height);
	
	if(bPlaceImage){  
		var myDiv=document.createElement("div");  
		myDiv.appendChild(myCanvas);
		image.parentNode.appendChild(myCanvas);
	}
	
	return myCanvas.toDataURL();
}

$(document).ready(function() {
	var newImage = $('#image')[0];
	
	if(navigator.appName != 'Netscape' && navigator.appName != 'Opera')
		newImage.style.filter = 'progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);';
	else{
		newImage.normalImage=grayscale(newImage, false);
		newImage.src=newImage.normalImage;
	}
});
</script>


И кода HTML:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Untitled Document</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
</head>

<body>
<img src="pic1.png" width="346" height="230" id="image" />
</body>
</html>
Ответить с цитированием
  #2 (permalink)  
Старый 07.03.2012, 15:34
Интересующийся
Отправить личное сообщение для Kaba Посмотреть профиль Найти все сообщения от Kaba
 
Регистрация: 18.10.2011
Сообщений: 19

В общем, поэкспериментировав понял, хром ни под каким углом не хочет работать без события load.

Повесил это событие, все замечательно, но загвоздка в том то что изображение которое необходимо обработать подгружается с помощью Ajax, следовательно найти его можно только после обновления DOM. Добавляю событие live и в итоге, все что в событии load перестает работать.

Подскажите, в чем заключается ошибка?

$('#button').live('click', function(){
	$('#img_crop_new').load(function(){
		$('#img_crop_new').jToningImage();
	});
});
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Функция не работает без jQuery(function() { shilinpavel jQuery 1 26.10.2011 09:05
JS работает в Опере, Хроме и Сафари, и не работает в IE & Mozilla Aliena Javascript под браузер 5 04.12.2010 07:15
Не работает функция из подключаемого файла evgenyan jQuery 3 28.10.2010 13:48
Mootools функция periodical не работает по id Jumong Общие вопросы Javascript 2 11.09.2010 15:42
Функция которая работает на OnLoad не хочет работать на OnClick libinstyle Элементы интерфейса 6 23.03.2010 00:42