Visualizzazione risultati 1 fino 8 di 8

Discussione: effetto grafico

  1. #1
    Guest

    Predefinito effetto grafico

    Ciao a tutti..

    con un amico stiamo realizzando un progetto.. io alla programmazione lui alla grafica.

    questo progetto consiste in una gallery. ovviamente è in fase di programmazione (e anche la grafica è ancora temporanea.)

    qui vedete un esempio...

    come vedete per muoversi nell'album si utilizzano il segnalibro a destra e a sinistra.... è possibile, tramite css o javascript fare un effetto che questa linguetta (immagine sovrapposta) si sposti orizzontalmente facendo un effetto di movimento (come se uscisse dal libro) verso il lato della schermo piu vicino?

    oppure avete altri consigli? vi ringrazio

  2. #2
    Guest

    Predefinito

    Ciao. E' possibile con js o ancora meglio (perchè più semplice) con jquery. Leggiti un po la guida su html.it e vedi che ne ricavi!

  3. #3
    Guest

    Predefinito

    avevo gia guardato.. ma esempi che si avvicinavano alla mia richiesta non ne ho visti... altri consigli?

    inoltre volevo applcare questo http://leandrovieira.com/projects/jquery/lightbox/ per la visione a dimensione reale delle immagini...

    1.scaricato l'archivio e inserito nella cartella di lavoro
    2.ho inserito quanto segue

    Codice PHP:
    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/jquery.lightbox-0.4.js"></script>
    e

    Codice PHP:
    <link rel="stylesheet" type="text/css" href="css/jquery.lightbox-0.4.css" media="screen" />
    nella pagina di lavoro

    poi

    Codice PHP:
    <script type="text/javascript">
    $(function() {

    $(
    '#gallery a').lightBox(); // Select all links in object with gallery ID

    });
    </script>

    e nello script che dinamicamente inserisce l'immagine ho inserito l'id

    Codice PHP:
    echo "<a id=\"galleria\" href=\"album/" . $_GET['album'] . "/" . $_GET['foto'] . ".jpg\" target=\"blank\"><p align=\"center\" ><img src=\"album/" . $_GET['album'] . "/" . $_GET['foto'] . ".jpg\" height=\"220px\" /></p></a>";


    quindi la mia pagina avrà la seguente testata:
    Codice PHP:
    <title>Galleria</title>
    <
    link href="vivivalpo.css" rel="stylesheet" type="text/css" />
    <
    link rel="stylesheet" type="text/css" href="css/jquery.lightbox-0.4.css" media="screen" />



    <
    script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/jquery.lightbox-0.4.js"></script>
    <script type="text/javascript">

    $ (function () {
    // utilizzare questo esempio, oppure ... $ ('a [@ rel lightbox *=]') lightbox ();.
    // Seleziona tutti i link che contiene in lightbox l'attributo rel
    $('#gallery a').lightBox();
    // Seleziona tutti i link in oggetto con ID galleria
    // Questo, o ... $ ('a. lightbox ') lightbox ();.
    // Seleziona tutti i collegamenti con classe lightbox
    // Questo, o ... $ (' a ') lightbox ();.
    // Seleziona tutti i link nella pagina
    // ... La possibilità sono molte Usa la tua creatività o scegliere uno degli esempi sopra riportati});.

    </script>

    </head>
    <body>
    e poi conterrà:

    Codice PHP:
    <div id="sxfoto" class="float"><div id="gallery">
    <?php

    if(file_exists("./album/" . $_GET['album'] . "/". $_GET['foto'] .".jpg")){
    echo
    "<a href=\"album/" . $_GET['album'] . "/" . $_GET['foto'] . ".jpg\" target=\"blank\"><p align=\"center\" ><img src=\"album/" . $_GET['album'] . "/" . $_GET['foto'] . ".jpg\" height=\"220px\" alt=\"\" /></p></a>"; //azione da eseguire se il file esiste

    }else{
    echo
    "<p align=\"center\" ><img src=\"./book_img/finito.jpg\" height=\"220px\" /></p>";

    //azione da eseguire se il file non esiste

    }



    ?>

    non funziona dove sbaglio?

    Vi ringrazio davvero tanto per l'aiuto che mi date ogni volta
    thanks...
    Ultima modifica di fendermx : 03-03-2011 alle ore 01.28.14

  4. #4
    Guest

    Predefinito

    Codice PHP:
    <script type="text/javascript">
    $(function() {

    $(
    '#gallery a').lightBox(); // Select all links in object with gallery ID

    });
    </script>

    Codice PHP:
    echo "<a id=\"galleria\" href=\"album/" . $_GET['album'] . "/" . $_GET['foto'] . ".jpg\" target=\"blank\"><p align=\"center\" ><img src=\"album/" . $_GET['album'] . "/" . $_GET['foto'] . ".jpg\" height=\"220px\" /></p></a>";
    Qua devi mettere come id gallery e non galleria.. COme vedi nello script indica che l' ID è gallery ed è contenuto in un link, quindi diventa

    Codice PHP:
    echo "<a id=\"gallery\" href=\"album/" . $_GET['album'] . "/" . $_GET['foto'] . ".jpg\" target=\"blank\"><p align=\"center\" ><img src=\"album/" . $_GET['album'] . "/" . $_GET['foto'] . ".jpg\" height=\"220px\" /></p></a>";

  5. #5
    Guest

    Predefinito

    purtroppo non va

    -

    o meglio.... funziona, ma solo sulla sinistra:

    Codice PHP:
    echo "<a id=\"gallery\" href=\"album/" . $_GET['album'] . "/" . $_GET['foto'] . ".jpg\" target=\"blank\"><p align=\"center\" ><img src=\"album/" . $_GET['album'] . "/" . $_GET['foto'] . ".jpg\" height=\"220px\" alt=\"\" /></p></a>"; //azione da eseguire se il file esiste
    mentre a destra nulla...

    Codice PHP:
    echo "<a id=\"gallery\" href=\"album/" . $_GET['album'] . "/$sum.jpg\" target=\"blank\"> <p align=\"center\" > <img src=\"album/" . $_GET['album'] . "/$sum.jpg\" height=\"220px\" /></p></a>";
    non capisco il perchè..... idee?

    tutti e due sono in un div avente id="gallery".....

    -

    per quanto riguarda la lightbox ho risolto..

    mi rimane in sospeso il discorso

    come vedete per muoversi nell'album si utilizzano il segnalibro a destra e a sinistra.... è possibile, tramite css o javascript fare un effetto che questa linguetta (immagine sovrapposta) si sposti orizzontalmente facendo un effetto di movimento (come se uscisse dal libro) verso il lato della schermo piu vicino?


    ho provato a leggere in giro, ma non saprei proprio comefare...
    Ultima modifica di darkwolf : 03-03-2011 alle ore 14.13.59

  6. #6
    Guest

    Predefinito

    Prova così allora:

    Codice PHP:
    <script type="text/javascript">
    $(function() {

    $(
    '.gallery a').lightBox(); // Select all links in object with gallery ID

    });
    </script>
    Codice PHP:
    echo "<a class=\"gallery\" href=\"album/" . $_GET['album'] . "/" . $_GET['foto'] . ".jpg\" target=\"blank\"><p align=\"center\" ><img src=\"album/" . $_GET['album'] . "/" . $_GET['foto'] . ".jpg\" height=\"220px\" alt=\"\" /></p></a>"; //azione da eseguire se il file esiste
    Codice PHP:
    echo "<a class=\"gallery\" href=\"album/" . $_GET['album'] . "/$sum.jpg\" target=\"blank\"> <p align=\"center\" > <img src=\"album/" . $_GET['album'] . "/$sum.jpg\" height=\"220px\" /></p></a>";

  7. #7
    Guest

    Predefinito

    grazie!!!

  8. #8
    Guest

    Predefinito

    rieccomi....
    mi interessava questo effetto anche: http://www.webdesignerwall.com/demo/...ide-panel.html

    dove il codice si trova qui all'esempio 1 http://webdesignerwall.com/tutorials...-for-designers

    come posso portarmelo sul lato sinistro? ho provato a smanettare ma non riesco, anche xke la larghezza (che poi diventerà altezza portandolo sul lato sinistro) è legata alla lunghezza del body....

Regole di scrittura

  • Non puoi creare nuove discussioni
  • Non puoi rispondere ai messaggi
  • Non puoi inserire allegati.
  • Non puoi modificare i tuoi messaggi
  •