Форум

Кудаив · #1 (**permalink**) 07.12.2011, 13:48

добрый день нижайше прошу помочь- размещаем на хтмл странице картинку и как сделать чтобы при каждом следущем клике по картинке она смещалась вправо-вверх?

Кудаив · #2 (**permalink**) 07.12.2011, 13:51

если можно ответить кодом-я нуб нубской в яве

Pavel M. · #3 (**permalink**) 07.12.2011, 17:53

Сообщение от Кудаив

размещаем на хтмл странице картинку и как сделать чтобы при каждом следущем клике по картинке она смещалась вправо-вверх?

можно так

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <title>demo</title>
  <script type='text/javascript' src='http://code.jquery.com/jquery-git.js'></script>
  
  <style>
    img {
		position: absolute;
		left: 0;
		top: 100px;
	}
  </style>

<script>
$(window).load(function(){

	$('img').click(function () {
		$(this).css({left: '+=5', top: '-=5'});
	});
});
</script>

</head>
<body>
  <img src="http://javascript.ru/forum/images/ca_serenity/misc/logo.gif">
</body>
</html>

Кудаив · #4 (**permalink**) 08.12.2011, 20:27

Pavel M.,
извиняюсь, а как сделать тоже самое не подключая http://code.jquery.com/jquery-git.js', а прописав функцию в самом хтмл файле?

devote · #5 (**permalink**) 08.12.2011, 20:39

Сообщение от Кудаив

Pavel M.,
извиняюсь, а как сделать тоже самое не подключая http://code.jquery.com/jquery-git.js', а прописав функцию в самом хтмл файле?

Открыть jQuery в блокноте, скопировать все что там есть и вставить на страницу

melky · #6 (**permalink**) 08.12.2011, 23:31

замечание: в замыкании находится только переменная ie, остальное убивается

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <title>demo</title>  
  <style>
    img {
		position: absolute;
		left: 0;
		top: 100px;
	}
  </style>

<script>
window.onload = function(){
    var ie = /*@cc_on!@*/0;
    document.body.onclick = function(e){
        var a = ie ? event.srcElement:e.target,
            curr = ie ? a.currentStyle:getComputedStyle(a, null);
        a = a.style; 
        a.left = parseInt(curr.left||0)+5 + 'px';
        a.top = parseInt(curr.top||0)-5 +'px';
        document.body.onclick = function(e){
            var a = ie ? event.srcElement:e.target;
            a = a.style;
            a.left = parseInt(a.left)+5 + "px";
            a.top = parseInt(a.top)-5 + "px";
        }
    }
    
}
</script>

</head>
<body>
  <img src="http://javascript.ru/forum/images/ca_serenity/misc/logo.gif">
</body>
</html>

Форум

Справочник

Discord чат

Курсы javascript