• User Attivo

    Potrebbe esser un Hide/show windows... ?


  • Moderatore

    Prova *Modals *di NoNumber, estensione Joomla! anche in versione free: nonumber.nl/extensions/modals


  • User Attivo

    installato...ma non trovo alcuna configurazione back end e ne settaggi. Forse si agisce da codice perche stavo leggendo che crea anche un tag {modal ...}...{/modal}

    😮

    ahahahah...


  • User Attivo

    Cmq non penso che abbia la funzionalita sopra descritta, penso che abbia come funzionalità di ingrandire un immagine oscurando il resto, infatti qui è chiaro:
    nonumber . nl / extensions / modals

    oppure mi sto perdendo tra le funzionalita che offre il service.

    Cercavo questo: bblacastellana. com / intro. php?lnk=1 (dalla home--> struttura)

    Grassiee :sbav:


  • Moderatore

    Quello lo fai come ti ho detto con jquery e css, senza estensioni. 🙂


  • User Attivo

    Appunto...quindi, non capisco cosa ho installato 😄 eheh


  • Moderatore

    Modals è utilissimo, ti mostra una finestra con quello che tu vuoi dentro: immagini, articoli di Joomla, testo, mappe, altre url.
    Se però vuoi una cosa identica a quella di "bblacastellana", anche nel design, allora te la devi fare da zero (a meno che non sai già che hanno usato un script disponibile in rete).


  • Moderatore

    Sai come inserire il codice nella pagina?


  • User Attivo

    Ma come li vedo o setto? almeno ho un idea di cosa mi offre Modals prima di iniziare a imprecare sul codice. Magari mi offre quaqlcosa di similare a "bblacastellana". @FDA said:

    Modals è utilissimo, ti mostra una finestra con quello che tu vuoi dentro: immagini, articoli di Joomla, testo, mappe, altre url.

    Insomma, l ho installato ma non trovo alcuna configurazione da settare. Forse mi sto perdendo qualche pezzo?

    PS: perche nn si può modificare il titolo della discussione?


  • Moderatore

    perche nn si può modificare il titolo della discussione?
    Il titolo della discussione purtroppo non si può modificare, ma se scegli la "modalità avanzata" puoi inserire un titolo al singolo post.

    non trovo alcuna configurazione da settare. Forse mi sto perdendo qualche pezzo?
    Peter mette a disposizione una demo con la sintassi: demo.nonumber.nl/index.php/12-modals

    Non prendo impegni formali, ma se riesco ti posto il codice. Tu intanto cerca alternative, non basarti solo su di me. 😄


  • User Attivo

    @FDA said:

    Sai come inserire il codice nella pagina?

    Intendi codice html / php ? Penso in qualche pagina (da trovare) nel FTP.

    Oppure intendi qualche altro codice?

    Grazie infinite Francesco


  • User Attivo

    Miii mi arrivano le notifiche per mail alla discussione ma nn vedo le risposte ahahaha


  • Moderatore

    Per l'inserimento del codice si può fare in vari modi, te ne segnalo tre:

    1. modificare i file del template nella cartella html (sì, via FTP con un editor): in questo caso c'è un po' da smanettare per fare in modo che quella cosa compaia soltanto su alcune pagine e non in tutte, tra l'altro non è facile e in qualche caso neanche "efficiente";
    2. creare un'estensione;
    3. inseerire il codice in un modulo.

    Ciascuna di queste strade nasconde qualche insidia. :vai:

    Di nulla. 😉


  • User Attivo

    ...Ma se trovassi qualcosa di similare ma che lasci sempre il background libero? Esiste?

    Altrimenti, son finito, mi so venduto la fontana di trevi non avendocela! Dovrei far cambiare idea al cliente...:?


  • Moderatore

    No, macché cambiare idea ... lo puoi fare come vuoi, è web design. :smile5:
    Cosa intendi per "che lasci sempre il background libero"?


  • User Attivo

    che cmq le foto scorrono ma poi all occorrenza cliccando il "+" si apre questa finestrella con delle foto e descrizioni proprio come quel sito...

    Grazie Francesco che mi rinQuori sempre 🙂


  • Moderatore

    Non facciamo confusione tra la slideshow sullo sfondo e "la finestrella", cioè l'elemento interessato dall'effetto jQuery seguente: api.jquery.com/fadetoggle/

    Immagina di volere applicare questo effetto in una pagina index.html (se .php non cambia nulla). Ti servono almeno 2 immagini per il "+" e il "-", più eventualmente una terza immagine come sfondo della "finestrella", che da adesso in poi chiamo box per non essere tacciato di essere terrone (quale in effetti sono :D).
    La pagina avrà certamente un foglio di stile, che però possiamo ignorare. Caricherà il jquery e un secondo file .js con la funzione per il box.
    In definitiva avrai queste cartelle e files:

    index.html (file);
    js (folder con all'interno il file custom.js);
    css (folder con il file del foglio di stile custom.css, che per semplicità ignoriamo);
    img (folder delle immagini con i tre file: apri.png, chiudi.png, box.png).

    File index.html

    
    <!DOCTYPE html>
    <html>
        <head>
            <meta charset=utf-8>
            <meta name=viewport content="width=device-width, initial-scale=1.0">
            <title>fadeToggle by jQuery</title>
            <meta name=description content="fadeToggle by jQuery">
            <link rel="stylesheet" type="text/css" href="css/custom.css">
            <script type="text/javascript" src="js/custom.js"></script>
            <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
        </head>
        <body>
            <header>
                <h1>fadeToggle by jQuery</h1>
            </header>
    
            <section>
                <div style="position:absolute;margin:0px 0px 0px 800px;width:60px;height:24px;">
                    <a href="#" onclick="return toggle_contenuto();"><img id="img_toggle_contenuto" src="img/chiudi.png" /></a>
                </div>			
                <div id="cont_interno_pagina" style="position:absolute;margin:24px 0px 0px 500px;width:400px;height:400px;background-image:url(img/box.png);">			
                    <div style="position:absolute;margin:30px 0px 0px 0px;padding:0px 15px;">
                        <strong>Contenuto</strong>
                        <br/>
                        Questo &egrave; il <strong>contenuto</strong>.
                    </div>
                </div> 
            </section>
        </body>
    </html>
    
    

    Per rendere responsive il tutto devi lavorare via css. Ripeto che il link al custom.css è stato inserito per completezza, ma il file non serve per mostrare il funzionamento del box. Se la tua pagina già carica il jQuery puoi eliminare la riga del jquery-latest.js.

    File custom.js

    
    var clicked_contenuto = false;
    
    
    function toggle_contenuto(){
    	if(!clicked_contenuto){
    		clicked_contenuto = true;
    		$('#cont_interno_pagina').fadeToggle('slow',function(){
    			if($("#cont_interno_pagina").is(':visible')){
    				$('#img_toggle_contenuto').attr('src','img/chiudi.png');
    			}else{
    				$('#img_toggle_contenuto').attr('src','img/apri.png');
    			}
    			clicked_contenuto = false;
    		});	
    	}
    	return false;
    }
    
    

    Per le tre immagini puoi ispirarti a quelle del sito che mi hai mostrato.


    Puoi seguire le istruzioni sopra e procedere a mano oppure seguire una delle altre due strade suggerite: l'uso dei moduli o la creazione di un'estensione.
    Se ho un po' di tempo posto una delle altre due soluzioni, ma le istruzioni sopra già risolvono il problema. Mi raccomando soltanto al discorso mobile-responsive, perché non si può lasciare un box fisso e mandare all'aria il design. 😉

    Fammi sapere se hai risolto,
    Francesco


  • User Attivo

    [/HR]ASPEEEEE...

    mo maj fatt ju doppj pass e magg pers.

    PEr chi non è terrone 😄
    " Mi hai fatto il doppio passo e mi son perso"

    Provo a fare questa prova con 2 file e 3 immagini e ti faccio sapere.

    Sei un grande, se ti candidi, ti faccio campagna politica gratis!!!!:giggle:


  • Moderatore

    Ottimo, così almeno un voto lo prendo ... :lol:


  • User Attivo

    Allora, ci sto "SBATTENDO". Non mi ritorna qualcosa:

    1. perche nel html trovo solo l'azione per l'apertura della pop up? Trovo solamente la chiusura.
      [HTML] <a href="#" onclick="return toggle_contenuto();"><img id="img_toggle_contenuto" src="img/chiudi.png" /></a>[/HTML]

    2. Come mai al lancio dell'index trovo la pop up aperta? Non dovrebbe caricarsi sull'onlick?

    Questo è quanto prodotto:

    dropbox com/s/behhmxi6kfauuht/esempio.jpg?dl=0

    Grazie:vai: