Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #31 (permalink)  
Старый 01.05.2022, 11:34
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 32,177

Vaska,
так попробуйте
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <style>
                header {
                        background: cyan;
                        min-height: 100px;
                }

                .content_container {

                        background: rgba(255, 0, 0, 0.3);
                        padding: 20px;

                }

                .inner-content {
                        height: 400px;
                        margin: 5px;
                        background: red;
                        overflow:  scroll;
                }

                footer {
                        background: cyan;
                        min-height: 500px;
                }
    </style>
    <title></title>
</head>
<body>
    <header>
        <div>
            other content
        </div>
        <p>text two</p>
    </header>
    <div id="haupt">
        <div id="acidhaupt" class="haupt-wrap background-color">
            <div class="content_container">
                <div id="content_a" class="inner-content" data-url="/first.html"></div>
                <div id="content_b" class="inner-content" data-url="/second.html"></div>
                <div id="content_c" class="inner-content" data-url="/third.html"></div>
                <div id="content_d" class="inner-content" data-url="/fourth.html"></div>
            </div>
        </div>
    </div>
    <footer>
        <p>footer content</p>
    </footer>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
    <script>
                document.addEventListener('DOMContentLoaded', function() {
                        const lazyShow = divs => {
                                divs.forEach(e => {
                                        if (e.intersectionRatio < .3) return;
                                        let div = e.target,
                                                url = div.dataset.url;
                                    if(url.indexOf('/home/Goods/consulting.html') !== -1)
                                    $(div).load("/home/Goods/consulting.html?goods_id=2&store_id=1", function(){
                                        // Membership card
                                        $(div).find('[dstype="mcard"]').membershipCard({type:'shop'});
                                    });
                                    else $(div).load(url);
                                        observer.unobserve(div);
                                });
                        };
                        let observer = new IntersectionObserver(lazyShow, {
                                rootMargin: "10px",
                                threshold: [.3]
                        });
                        document.querySelectorAll('.inner-content').forEach(div => observer.observe(div))

                });
    </script>
</body>
</html>
Ответить с цитированием
  #32 (permalink)  
Старый 01.05.2022, 11:34
Профессор
Отправить личное сообщение для Vaska Посмотреть профиль Найти все сообщения от Vaska
 
Регистрация: 08.05.2017
Сообщений: 163

Сообщение от рони Посмотреть сообщение
пост #6
С параметрами не работает. Если не нужно передавать параметры, то хорошо работает.
Хотелось, чтобы и с параметрами работал.
Но и на этом спасибо, первоначальная задача решена.
Ответить с цитированием
  #33 (permalink)  
Старый 01.05.2022, 11:39
Профессор
Отправить личное сообщение для Vaska Посмотреть профиль Найти все сообщения от Vaska
 
Регистрация: 08.05.2017
Сообщений: 163

Сообщение от рони Посмотреть сообщение
Vaska,
так попробуйте
По всему сайту таких Ajax'ов множество.
Все их запихивать в один скрипт не годится.
Скрипт будет огромных размеров или на каждой странице плодить экземпляр скрипта, что просто ухудшит то, что сейчас есть без скрипта.
Ответить с цитированием
Ответ


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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Загрузка контента из файла по ID в зависимости от ID нажатой кнопки oldeuboi Элементы интерфейса 3 16.11.2018 06:33
Скрипт смены контента в Div keystation Events/DOM/Window 23 11.03.2016 15:17
Загрузка ajax'ом в определенный div Daniel93 AJAX и COMET 12 23.02.2015 00:06
Загрузка в DIV Алллексей Элементы интерфейса 2 02.08.2013 14:54
Не получается загрузить баннер в раздел DIV методами Javascript через iframe ((( autobuh Общие вопросы Javascript 3 24.07.2009 18:24