Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 03.07.2015, 21:30
Аспирант
Отправить личное сообщение для stem Посмотреть профиль Найти все сообщения от stem
 
Регистрация: 09.03.2013
Сообщений: 36

JS определить высоту img и вписать стиль для другого блока
Всем привет!
Прочитал уже много тем и статей, но никак не могу разобраться.
Читал тут:
http://jquery.page2page.ru/index.php...BD%D1%82%D0%B0
http://www.cyberforum.ru/javascript-...ead368804.html
http://ru.stackoverflow.com/question...BE%D0%BA%D0%B0
Высота div - как определить?

Имеется фоновое изображение со 100% шириной на экран, необходимо определить его высоту и подставить значение в отступ другого блока через style.
Код для определения высоты использую такой:
<script>
    $("#page-header-bg img").css("height", function(i,val){
	return val;
    };
</script>


Еще есть вот такой код, в нем берется высота nav и подставляется style height для фоновой полосы nav на всю ширину, но я в нем не понимаю:
jQuery(window).bind('resize', (function ($) {
    "use strict";
    return function() {
        var menu = jQuery("nav.nav");
        var menuOffset = menu.offset();
        var pageOffset = jQuery('#main').offset();
        if (!menuOffset || !pageOffset) {
            return;
        }
        jQuery("#hmenu-bg").css({
            "height": menu.outerHeight() + "px",
            "top": (menuOffset.top - pageOffset.top) + "px"
        });
    };
})(jQuery));


Другой блок - это меню (<nav class="nav">). Хотелось бы чтобы на странице добавился код:
<style>.nav{margin-top:высота}</style>

или чтобы в сам блок записался стиль вот так
<nav class="nav" style="margin-top:высота">


С моим примером получается только определить высоту, а вот как подставить значение val к другому блоку, увы, не хватает знаний JS

Последний раз редактировалось stem, 03.07.2015 в 21:38.
Ответить с цитированием
  #2 (permalink)  
Старый 03.07.2015, 21:53
Аспирант
Отправить личное сообщение для stem Посмотреть профиль Найти все сообщения от stem
 
Регистрация: 09.03.2013
Сообщений: 36

Пробую такой код, но не получается, срабатывает через какое то время только.
<script>
    jQuery(window).bind('resize', (function ($) {
    "use strict";
    return function() {
        var fon = jQuery("#page-header-bg img");
        var fonOffset = fon.offset();
        
        if (!fonOffset) {
            return;
        }
        jQuery("nav.nav").css({
            "margin-bottom": fon.outerHeight() + "px"
        });
    };
	})(jQuery));
	</script>
Ответить с цитированием
  #3 (permalink)  
Старый 03.07.2015, 21:59
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

Сообщение от stem
необходимо определить его высоту и подставить значение в отступ
Поясните зачем ? (Не проще перенести тот элемент вслед за c фоновой картинкой) ?
Ответить с цитированием
  #4 (permalink)  
Старый 03.07.2015, 22:15
Аспирант
Отправить личное сообщение для stem Посмотреть профиль Найти все сообщения от stem
 
Регистрация: 09.03.2013
Сообщений: 36

Сообщение от Deff Посмотреть сообщение
Поясните зачем ? (Не проще перенести тот элемент вслед за c фоновой картинкой) ?
Нет, картинка на всю ширину экрана, а блоки ниже, которые должны сдвигаться идут по максимальной ширине сайта, там свои заморочки с версткой, так надо, на других страницах эти блоки сдвигаются под разной высотой, блок контента выше чем сайдбар и контент заходит на фоновое изображение которое уже статично ширине и высоте. И мне нужно было решение без мультишаблона.

Вставил этот код в общий файл скриптов и все заработало, без тормозов.

Последний раз редактировалось stem, 03.07.2015 в 22:29.
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
виджет, только сторона клиента (JS, JQUery, работа с датами, масштабирование) eugen35 Работа 4 31.07.2014 09:50
Как объединить 4 одинаковых функции Batyabest Общие вопросы Javascript 2 21.12.2013 22:53
поиск классов внутри тега yozuul jQuery 24 14.06.2013 22:00
Некорректная работа get(set)Attribute в IE для элементов img back to back Internet Explorer 15 09.06.2012 16:52
Определить кроссбраузерно высоту блока. TaskO Элементы интерфейса 5 18.07.2010 09:54