[RISOLTO]Header e scrollup?

[adottauncane2]

Comunque devo essermi spiegato male..quando dico che devo cambiare il colore del logo intedevo dire che cambio proprio l'immagine del logo.
Nel senso che io come logo ho caricato un'immagine colorata..e quando scrollo l'immagine coloroata viene sostituita con un'immagine uguale ma tutta bianca.

[Limma]

Comunque devo essermi spiegato male...

Un po' sì, un po' no... 

Nei miei post precedenti avevo comunque specificato bene che avevo modificato il logo nella visualizzazione da mobile, ma esclusivamente in formato testo,
Per fare quello che chiedi tu - quindi cambiare l'"immagine-logo" allo scroll della pagina bisogna nell'ordine:
- modificare il file tempateDetails.xml
- modificare il file logo.php
- aggiungere una nuova serie di regole css

Il punto è che la documentazione in merito sul sito di Joomshaper è nulla, e anche nel forum non si trova praticamente nulla. Si potrebbe provare a chiedere sul forum di Joomshaper, ma bisogna avere una sottoscrizione a pagamento per postare.

Chiudo qui i miei interventi in merito alla questione, ma sono sufficientemente soddisfatto dei css che ho elaborato per le modifiche degli header di Helix 3...! 

[adottauncane2]

risolto

1.ho creato un mio modulo custom e messo al posto di "logo"
2 ho creato delle classi che con un background url si prendono il logo una per il logo bianco e una per quello verde. Le classi le ho associate al mio modulo custom.
3l modificando il file mainjs aggiungo e rimuovo le regole css dal mio  modulo custom in base allo scrolling.

[Limma]

Ottima soluzione! 

La via attraverso il file logo.php era stata suggerita dagli stessi sviluppatori di Helix3.

Puoi condividere le modifiche al file main.js?

[adottauncane2]

Ho preso spunto dalla logica della prima funzione e ne ho creata una simile ma con le classi da me create nel css.
Occhio alle variabili; in velocità le ho rinominate solamente aggiungendo un 2 alla fine del nome di ciascuna variabile.

Codice: [Seleziona]

// if sticky header
    if ($("body.sticky-header").length > 0) {
        var fixedSection = $('#sp-header');
        // sticky nav
        var headerHeight = fixedSection.outerHeight();
        var stickyNavTop = fixedSection.offset().top;
        fixedSection.addClass('animated');
        fixedSection.before('<div class="nav-placeholder"></div>');
        $('.nav-placeholder').height('inherit');
        //add class
        fixedSection.addClass('menu-fixed-out');
        var stickyNav = function () {
            var scrollTop = $(window).scrollTop();
            if (scrollTop > stickyNavTop) {
                fixedSection.removeClass('menu-fixed-out').addClass('menu-fixed');
                $('.nav-placeholder').height(headerHeight);
            } else {
                if (fixedSection.hasClass('menu-fixed')) {
                    fixedSection.removeClass('menu-fixed').addClass('menu-fixed-out');
                    $('.nav-placeholder').height('inherit');
                }
            }
        };
        stickyNav();
        $(window).scroll(function () {
            stickyNav();
        });
    }
   
    // change logo // modificato da adottauncane2 volendo posso incorporare questa funzione con quella sopra per ottimizzare
    if ($("body.sticky-header").length > 0) {   
        var changeLog = $('#sp-miologo');
        changeLog.addClass('logoWhite');
        // sticky nav
        var headerHeight2 = changeLog.outerHeight();
        var stickyNavTop2 = changeLog.offset().top;
        //add class
        //fixedSection.addClass('menu-fixed-out');
        var stickyNav2 = function () {
            var scrollTop = $(window).scrollTop();
            if (scrollTop > stickyNavTop2) {
                changeLog.removeClass('logoWhite').addClass('logoGreen');
                $('.nav-placeholder').height(headerHeight);
            } else {
                if (changeLog.hasClass('logoGreen')) {
                    changeLog.removeClass('logoGreen').addClass('logoWhite');
                    $('.nav-placeholder').height('inherit');
                }
            }
        };
        stickyNav2();
        $(window).scroll(function () {
            stickyNav2();
        });
    }

[Limma]

Grazie per la condivisione! 

[adottauncane2]

Grazie per la condivisione! 

  Grazie a voi per l'aiuto.