Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Подскажите как подставить значение переменной в width и height (https://javascript.ru/forum/misc/43452-podskazhite-kak-podstavit-znachenie-peremennojj-v-width-i-height.html)

Миша-1993 06.12.2013 00:07
Подскажите как подставить значение переменной в width и height
 
$(document).ready(function() {
        var cont_left = $(".image_block").position().left;
        $("a .jshop_img").hover(function() {
            // приближение
            $(this).parent().parent().css("z-index", 1);
            $(this).animate({
               height: "300",
               width: "250",
               left: "-=50",
               top: "-=50"
            }, "fast");
        }, function() {
            // отдаление
            $(this).parent().parent().css("z-index", 0);
            $(this).animate({
                height: "150",
                width: "150",
                left: "+=50",
                top: "+=50"
            }, "fast");
        });
        
        $(".img").each(function(index) {
            var left = (index * 160) + cont_left;
            $(this).css("left", left + "px");
        });
    });

Миша-1993 06.12.2013 00:10 
$(document).ready(function() {
var cont_left = $(".image_block").position().left;
$("a .jshop_img").hover(function() {
// приближение
$(this).parent().parent().css("z-index", 1);
$(this).animate({
height: "300",<----СЮДА
width: "250",<-----И СЮДА

Хочу определетиль изначальный размер картинки и умножить значения width и height на 2, а потом присвоить получившиеся значения в width и height. Как реализовать подскажите?

ksa 06.12.2013 08:43
Цитата:
Сообщение от Миша-1993 (Сообщение 284850) 
$(this).animate({
height: "300", //<----СЮДА
width: "250", //<-----И СЮДА
Так и пиши

var h=600;
var w=500;
$(this).animate({
height: h, //<----СЮДА
width: w,  //<-----И СЮДА

Миша-1993 06.12.2013 12:41
Цитата:
Сообщение от ksa (Сообщение 284869)
Так и пиши

var h=600;
var w=500;
$(this).animate({
height: h, //<----СЮДА
width: w,  //<-----И СЮДА
Хорошо) Пол дела есть) Спасибо) Теперь, есть ли какая нибудь функция, которая позволит узнать размеры картинки, загруженной на сайт? Короче говоря нужно, чтобы картинка при наведении увеличивалась в 2 раза.

ksa 06.12.2013 13:03
Цитата:
Сообщение от Миша-1993
есть ли какая нибудь функция, которая позволит узнать размеры картинки, загруженной на сайт?
Как вариант...

<img src='http://javascript.ru/forum/images/smilies/smile.gif' />
<script type="text/javascript">
var o=document.getElementsByTagName('img')[0];
alert(o.clientWidth+'x'+o.clientHeight);
</script>

Миша-1993 06.12.2013 13:13
Цитата:
Сообщение от ksa (Сообщение 284894)
Как вариант...

<img src='http://javascript.ru/forum/images/smilies/smile.gif' />
<script type="text/javascript">
var o=document.getElementsByTagName('img')[0];
alert(o.clientWidth+'x'+o.clientHeight);
</script>
Не очень понял как применить это в моем коде...

Миша-1993 06.12.2013 13:20 
$(document).ready(function() {
		var cont_left = $(".image_block").position().left;
		
	$("a .jshop_img").hover(function() {
	            // приближение
            $(this).parent().parent().css("z-index", 1);
            $(this).animate({
               var h = ...//как то получить height картинки
               var w = ...//как то получить width картинки
               height: h * 2,
               width: w * 2,
               left: "-=50",
               top: "-=50"
            }, "fast");
        }, function() {
            // отдаление
            $(this).parent().parent().css("z-index", 0);
            $(this).animate({
                height: "150",
                width: "150",
                left: "+=50",
                top: "+=50"
            }, "fast");
        });
        
        $(".img").each(function(index) {
            var left = (index * 160) + cont_left;
            $(this).css("left", left + "px");
        });
    })


Как то так мне нужно. Картинок много и они разных размеров, поэтому src не знаю как прописать, сайт на joomla и картинки это товары интернет магазина, которые выводятся из бд.

ksa 06.12.2013 13:21
Цитата:
Сообщение от Миша-1993
Не очень понял как применить это в моем коде...
Значит не судьба...

Миша-1993 06.12.2013 13:27
Цитата:
Сообщение от ksa (Сообщение 284903)
Значит не судьба...
 
$(document).ready(function() {
		var cont_left = $(".image_block").position().left;
		
	$("a .jshop_img").hover(function() {
	        var h = $(this).height();
            var w = $(this).width();
	            // приближение
            $(this).parent().parent().css("z-index", 1);
            $(this).animate({
               height: h * 2,
               width: w * 2,
               left: "-=50",
               top: "-=50"
            }, "fast");
        }, function() {
            // отдаление
            $(this).parent().parent().css("z-index", 0);
            $(this).animate({
                height: "150",
                width: "150",
                left: "+=50",
                top: "+=50"
            }, "fast");
        });
        
        $(".img").each(function(index) {
            var left = (index * 160) + cont_left;
            $(this).css("left", left + "px");
        });
    })

Вот что я хотел. Все работает.


Часовой пояс GMT +3, время: 14:42.