Вопрос по Js and CSS
1. Александр (30.08.2013 / 22:06)Вообщем долго думал но не как не получается, может кто подскажет.
Вообщем нужно чтобы к примеру блок с дивом класса "div1", так вот мне нужно чтобы размер этого блока а точнее цифра размера была в другом диве но со значением margin-top.
Т.е. есть 2 класса это к примеру "div1" и "div2" вот, нужно чтобы значение высоты(height) этого дива равнялось значению "div2" только не высоты а отступа(margin). Буду очень благодарен если и кто поможет уже голова кипит(((
2. marti91 (30.08.2013 / 22:17)
не совсем понятно, если честно..
3. Александр (30.08.2013 / 22:26)
2. marti91, обьясню еще раз.
представим что к примеру, что есть два класса a1 и a2.
<div class="a1">text</div> <div class="a1">text</div>
вот и представим что высота блока дива a1 с контентом внутри - 200px
мне надо чтобы с помощью js в блоке с дивом a2 отступ стал тоже 200px
т.е.
<div style="height: [b]значение[/b]" class="a1">text</div> <div style="margin-top: [b]значение[/b] " class="a1">text</div>
но в блоке с дивом a1 указана высота, мне нужно чтобы она сама определялась и потом эта цифра была значение
4. marti91 (30.08.2013 / 22:44)
<!DOCTYPE html>
<html>
<head>
<title>THE NAME OF THE PAGE</title>
<meta charset="UTF-8">
<style>
.shit {
width: 300px;
height: 300px;
background: #000;
overflow: auto;
}
.son_of_the_shit {
max-width: 100%;
height: 200px;
background: #fff;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
$(function() {
var shit = $(".shit").css("height");
$(".son_of_the_shit").css({"margin-top": shit});
});
</script>
</head>
<body>
<div class="shit">
<div class="son_of_the_shit">
</div>
</div>
</body>
</html>
наверно так бы я сделал.Добавлено через 02:59 сек.
то же самое можно сделать и на чистом JS. jQuery - мое предпочтение.
5. Александр (30.08.2013 / 22:50)
4. marti91, не так но помог понять спасибо с меня 25к чатлов)
6. marti91 (30.08.2013 / 22:52)
5. A.Great, я примерно, тебе просто нужно узнать значение css-свойства, вот и все =)
7. Александр (30.08.2013 / 22:54)
6. marti91, а как сделать чтобы margin-top: - значение? кроче к примеру -200px?
8. marti91 (30.08.2013 / 22:56)
7. A.Great, то есть: margin-top: -200px; ?
9. Александр (30.08.2013 / 23:16)
8. marti91, да)
10. marti91 (30.08.2013 / 23:17)
9. A.Great, в таком случае через margin-top этого не добиться.
11. Александр (30.08.2013 / 23:18)
10. marti91, блин((((
12. marti91 (30.08.2013 / 23:20)
<!DOCTYPE html>
<html>
<head>
<title>NAME OF THE PAGE</title>
<meta charset="UTF-8">
<style>
.shit {
width: 300px;
height: 300px;
background: #000;
overflow: auto;
}
.son_of_the_shit {
max-width: 100%;
height: 300px;
background: red;
position: relative; // добавить позиционирование
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
$(function() {
var shit = $(".shit").css("height"); // в эту переменную - значение для отступа
$(".son_of_the_shit").css({"bottom": shit}); // тут задаем значение для отступа
});
</script>
</head>
<body>
<div class="shit">
<div class="son_of_the_shit">
</div>
</div>
</body>
</html>
Добавлено через 00:38 сек.
но можно же по другому
13. Александр (30.08.2013 / 23:25)
12. marti91, нет это не поможет надо чтобы именно с -
14. marti91 (30.08.2013 / 23:27)
13. A.Great, нет, работает, я ошибку где-то сделал.
Добавлено через 02:21 сек.
забыл "});"
попробуй еще раз, должно работатьДобавлено через 03:52 сек.
принцип работы такой, которого ты хочешь добиться.
15. Александр (30.08.2013 / 23:31)
14. marti91, ты не понимаешь мне надо чтобы был имено маргин минус
16. marti91 (30.08.2013 / 23:32)
15. A.Great, значит смотри, тебе нужно чтобы внутренний блок как бы пропал, я правильно понял?
17. Александр (31.08.2013 / 00:05)
16. marti91, нет это трудно объяснить, мне не нужно что что пропадала просто второй блок должен сместиться вверх на столько сколько имеет значение блок высоты
18. marti91 (31.08.2013 / 00:12)
17. A.Great, если что, можешь нарисовать как это должно выглядить.
19. Александр (31.08.2013 / 00:20)
вот как то так
URL: https://visavi.net/topics/38825