Chcę uruchomić funkcję carouselPartialView podczas ładowania strony, ale kiedy próbuję wywołać tę funkcję, nie działa, ale kiedy próbuję wywołać ją za pomocą funkcji resizeWitdthOnly, działa. Jak mogę sprawić, by działał podczas ładowania strony.

function resizeWidthOnly(a, b) {
    var c = [window.innerWidth];
    return onresize = function () {
        var d = window.innerWidth,
            e = c.length;
        c.push(d);
        if (c[e] !== c[e - 1]) {
            clearTimeout(b);
            b = setTimeout(a, 250);
        }
    }, a;
}

function carouselPartialView() {
    // settings
    var carousel = $("#carousel");
    var interval = 1000;
    var speed = 600;
    var xs_max = 767;
    var gutter = 30;
    var opacity = .7;
    // Derived vars.
    var wrapper = $(".wrapper");
    var slides = $(carousel).find('.slide').css('opacity', opacity);
    var carousel_width = $(carousel).width();
    var first_slide = $(slides[0]).css('opacity', 1);
    // Initial sizing and positioning.
    if (carousel_width >= xs_max) {
        // Let the css take over.
        $(slides).css('width', '');
    } else {
        $(slides).css('width', carousel_width + 'px');
        offset = 0;
    }
    var slide_width = $(first_slide).width();
    var offset = ((carousel_width - slide_width) / 2);
    $(wrapper).css('margin-left', offset);
    $(wrapper).width(slides.length * slide_width);

    // Click event listner
    $(slides).click(function () {
        slide_to(this);
    });
    function slide_to(elm) {
        // Slide to the current slide.
        var idx = $(slides).index(elm);
        $(wrapper).stop().animate({ 'margin-left': -(idx * slide_width) + offset }, speed)
        // Set the clicked slide to full opacity and nested fade out animation.
        $(elm).stop().css('opacity', 1, $(function () {
            $(slides).not(elm).stop().animate({ 'opacity': opacity }, speed / 3 * 2);
        }));
    }
};
// Init and resize.
resizeWidthOnly(function () {
    carouselPartialView();
})();
0
user11541073 19 listopad 2019, 19:52
Funkcja wywołania gotowa
 – 
Devsi Odedra
19 listopad 2019, 19:54
Lubię to ? $ (dokument) .ready (function () {carouselPartialView ();});
 – 
user11541073
19 listopad 2019, 19:56

3 odpowiedzi

Możesz użyć funkcji .ready (). Spróbuj tego:

$(document).ready(function() {
    carouselPartialView();
});

Przeczytaj więcej o tym tutaj: https://api.jquery.com/ready/

0
Mauricio Cárdenas 19 listopad 2019, 19:56
Czy funkcja jest wykonywana? Spróbuj umieścić plik console.log wewnątrz funkcji, aby upewnić się, że jest wywoływany.
 – 
Mauricio Cárdenas
19 listopad 2019, 20:12
Wydaje mi się, że próbujesz pracować z dynamicznie tworzonymi elementami, które z jakiegoś powodu nie są w stanie obsłużyć, gdy DOM jest gotowy. Funkcja .ready() powinna działać, a przynajmniej zostać wywołana. Jeśli tak nie jest, coś poza udostępnionym kodem nie działa poprawnie.
 – 
Mauricio Cárdenas
19 listopad 2019, 20:14
Jeśli coś console.log loguje w konsoli, ale zawartość się nie ładuje
 – 
user11541073
19 listopad 2019, 20:25
Wtedy ma to coś wspólnego z elementami, które obsługujesz. Spróbuj oddzielić je wszystkie i zobacz, który z nich nie ładuje się prawidłowo. Sprawdź swój element $("#carousel").
 – 
Mauricio Cárdenas
19 listopad 2019, 20:34

Wypróbuj window.onload

JQuery

$(window).load(carouselPartialView());

Javascript

window.onload = carouselPartialView();
0
Αntonis Papadakis 19 listopad 2019, 20:05

Szanse, że Twój kod nie działa na początku, ponieważ zawartość karuzeli jeszcze się nie załadowała, aby to potwierdzić spróbuj opóźnić wykonanie funkcji za pomocą setTimeout, chociaż nie jest to właściwe rozwiązanie nadal pomaga określić, dlaczego Twój kod nie działa:

   $(document).ready(function() {
    setTimeout(function(){
        carouselPartialView();
        },4000)
    });

Jeśli po 4 sekundach nic się nie dzieje, oznacza to, że problem pochodzi z czegoś innego

0
mondersky 19 listopad 2019, 20:40
Działa po 4 sekundach, ale chcę, aby wykonał się bezpośrednio przy ładowaniu strony
 – 
user11541073
20 listopad 2019, 16:07
Czy możesz opublikować kod html karuzeli? musimy zrozumieć, w jaki sposób Twoja karuzela jest ładowana, aby wiedzieć, kiedy wywołać funkcję
 – 
mondersky
20 listopad 2019, 20:32