SitePoint Sponsor

User Tag List

Page 2 of 3 FirstFirst 123 LastLast
Results 26 to 50 of 75
  1. #26
    Grüße aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,941
    Mentioned
    215 Post(s)
    Tagged
    12 Thread(s)
    Cool.

    So let's see if we can load the gallery into the page via AJAX and initialize it.

    Try this:

    HTML Code:
    <!DOCTYPE HTML>
    <html>
      <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>ColdFusion test</title>
        <style>img{ float:left;}</style>
      </head>
      
      <body>
        <button id="send">Send</button>
        <div id="result"></div>
    
        <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
        <script type="text/javascript" src="http://diem.sothenwhat.com/js/jquery.waterwheelCarousel.js"></script>
        <script>
          $("#send").on("click", function(){
            $.ajax({
              type: "GET",
              url: "gallery.cfm",
    	  cache: false,
              dataType: "html",
              success:function(res)	{
    	    $("#result").html(res);
    	    $("#result").waterwheelCarousel();
                $("#result").css({top:200});
              }
            });
          });
        </script>
      </body>
    </html>
    HereIs a demo of it working on my server.
    Notice, no page refresh.

  2. #27
    SitePoint Wizard donboe's Avatar
    Join Date
    Jun 2010
    Location
    Netherlands
    Posts
    2,117
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    This is great. Now the next question. Normaly I have links like this with url variables in order to load the right serie:
    Code:
    <a href="test.cfm?artwork=porsche" title="">Porsche</a>|<a href="test.cfm?artwork=hemingway" title="">Hemingway</a>|<a href="test.cfm?artwork=univers" title="">Universe</a>
    How would I integrate that in your system?
    “Good artists copy, great artists steal” (Pablo Picasso - 1934)

  3. #28
    Grüße aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,941
    Mentioned
    215 Post(s)
    Tagged
    12 Thread(s)
    Hi donboe,

    What you need to do next is to make a second ColdFusion page with the second gallery (just the same as the first).
    Then let me know and I'll update the demo.

    Here's a demo of where I'm going with this.

  4. #29
    SitePoint Wizard donboe's Avatar
    Join Date
    Jun 2010
    Location
    Netherlands
    Posts
    2,117
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    So basically what you say is to have a page for each gallery! But what if I don't know how many galleries there will be. The owner can add galleries when he needs to
    “Good artists copy, great artists steal” (Pablo Picasso - 1934)

  5. #30
    Grüße aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,941
    Mentioned
    215 Post(s)
    Tagged
    12 Thread(s)
    If it was me, I would do it like this (using PHP):

    Say you have five links for different galleries.
    When the user clicks on one of these links, the link's default action is prevented.
    Then an ajax request is fired to a PHP script, which passes a parameter indicating which gallery the user wants to view.
    Based on whatever parameter the PHP script receives, it can go and get all of the images tagged with that parameter (from the DB?) and return the appropriate HTML to the original page.
    Then, you would use JS to initialize the carousel with whatever HTML was returned.

    I hope that is possible in Cold Fusion. It would't be difficult in PHP.

  6. #31
    Grüße aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,941
    Mentioned
    215 Post(s)
    Tagged
    12 Thread(s)
    Also, if this is something your client should maintain himself, could you briefly describe the steps he would take (in an ideal world) to add images to the gallery.

  7. #32
    SitePoint Wizard donboe's Avatar
    Join Date
    Jun 2010
    Location
    Netherlands
    Posts
    2,117
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Pullo View Post
    If it was me, I would do it like this (using PHP):

    Say you have five links for different galleries.
    When the user clicks on one of these links, the link's default action is prevented.
    Then an ajax request is fired to a PHP script, which passes a parameter indicating which gallery the user wants to view.
    Based on whatever parameter the PHP script receives, it can go and get all of the images tagged with that parameter (from the DB?) and return the appropriate HTML to the original page.
    Then, you would use JS to initialize the carousel with whatever HTML was returned.

    I hope that is possible in Cold Fusion. It would't be difficult in PHP.
    Hi Pullo I have the idea that we are talking about the exact same thing. The differernt galleries are based on a mySql query:
    Code:
    <cfquery name="getArtwork">
    SELECT
            A.artwork_id
         ,  A.artwork_name
    FROM
            artwork A
    INNER
      JOIN artwork_photos AP
        ON  A.artwork_id = AP.artwork_id
    WHERE
         A.artwork_id = URL.artwork
    </cfquery>
    So what you call the parameter, did I call URL variable in my previous post. So basically there is just one page holding the query and output and indeed as you mentioned should the gallery show related to the link/button that is pressed. The links are created dynamically. So then the link in the Coldfusion situation would be:
    Code:
    <cfoutput query="getArtwork">
    <a href="#ajaxlink('test.cfm?artwork=#getArtwork.artwork_id#' )#">#getArtwork.artwork_name#</a>
    </cfquery>
    where artwork behind the ? is the URL variable and the #getArtwork.artwork_name# the gallery name. And since you use GET as TYPE one would think that that you could do something similar using your ajax method?
    Quote Originally Posted by Pullo View Post
    Also, if this is something your client should maintain himself, could you briefly describe the steps he would take (in an ideal world) to add images to the gallery.
    The clent can add a a gallery, by first giving it a name(artwork_name) , which is going into the table artwork. After which he can add photos to the table artwork_photos. the relation is created true a session. The same will happen when he wants to add photos to an existing gallery. Hope this makes everything a bit clearer.
    “Good artists copy, great artists steal” (Pablo Picasso - 1934)

  8. #33
    Grüße aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,941
    Mentioned
    215 Post(s)
    Tagged
    12 Thread(s)
    Hi,

    Thanks for the explanation. That certainly makes things clearer.

    So, do I understand you correctly, that to display the images associated with Porsche, your CF script needs the parameter artwork=porsche and to display the images associated with Hemminway, your CF script needs the parameter artwork=hemmingway?

  9. #34
    SitePoint Wizard donboe's Avatar
    Join Date
    Jun 2010
    Location
    Netherlands
    Posts
    2,117
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That is indeed what i mean In the mySql query that I showed you I used the artwork_id as an example to make it more clear, but I prefer to use the artwork_name, to make the URL more friendly looking. Can you do something with that
    “Good artists copy, great artists steal” (Pablo Picasso - 1934)

  10. #35
    Grüße aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,941
    Mentioned
    215 Post(s)
    Tagged
    12 Thread(s)
    Quote Originally Posted by donboe View Post
    Can you do something with that
    Sure can, Sir.

    Here's a demo.

    Here's the revised HTML:

    HTML Code:
    <!DOCTYPE HTML>
    <html>
      <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>ColdFusion test</title>
        <style>img{ float:left;}</style>
      </head>
      
      <body>
        <a href="#" data-gallery="porsche">Porsche</a>
        <a href="#" data-gallery="hemmingway">Hemmingway</a>
    
        <div id="result"></div>
    
        <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
        <script type="text/javascript" src="http://diem.sothenwhat.com/js/jquery.waterwheelCarousel.js"></script>
        <script>
          $("a").on("click", function(e){
            e.preventDefault();
            var gallery = $(this).data("gallery");
            $.ajax({
              type: "GET",
              url: "test3.php",
              data: {artwork: gallery},
              cache: false,
              dataType: "html",
              success:function(res)  {
                $("#result").html(res);
                $("#result").waterwheelCarousel();
                $("#result").css({top:200});
              }
            });
          });
        </script>
      </body>
    </html>
    And the revised PHP:

    PHP Code:
    <?php
      $gallery 
    $_GET['artwork'];
      
      if(
    $gallery == "porsche"){
        echo(
    '
        <img src="http://diem.sothenwhat.com/museum_photos/carousel/porsche1.jpg">
        <img src="http://diem.sothenwhat.com/museum_photos/carousel/porsche2.jpg">
        <img src="http://diem.sothenwhat.com/museum_photos/carousel/porsche3.jpg">
        <img src="http://diem.sothenwhat.com/museum_photos/carousel/porsche4.jpg">
        <img src="http://diem.sothenwhat.com/museum_photos/carousel/porsche5.jpg">
        <img src="http://diem.sothenwhat.com/museum_photos/carousel/porsche6.jpg">
        <img src="http://diem.sothenwhat.com/museum_photos/carousel/porsche7.jpg">
        <img src="http://diem.sothenwhat.com/museum_photos/carousel/porsche8.jpg">
        <img src="http://diem.sothenwhat.com/museum_photos/carousel/porsche9.jpg">
        <img src="http://diem.sothenwhat.com/museum_photos/carousel/porsche10.jpg">
        <img src="http://diem.sothenwhat.com/museum_photos/carousel/porsche11.jpg">
        <img src="http://diem.sothenwhat.com/museum_photos/carousel/porsche12.jpg">
        '
    );  
      } else {
        echo(
    '
        <img src="http://diem.sothenwhat.com/museum_photos/carousel/porsche13.jpg">
        <img src="http://diem.sothenwhat.com/museum_photos/carousel/porsche14.jpg">
        <img src="http://diem.sothenwhat.com/museum_photos/carousel/porsche15.jpg">
        <img src="http://diem.sothenwhat.com/museum_photos/carousel/porsche16.jpg">
        <img src="http://diem.sothenwhat.com/museum_photos/carousel/porsche17.jpg">
        <img src="http://diem.sothenwhat.com/museum_photos/carousel/porsche18.jpg">
        <img src="http://diem.sothenwhat.com/museum_photos/carousel/porsche19.jpg">
        <img src="http://diem.sothenwhat.com/museum_photos/carousel/porsche20.jpg">
        <img src="http://diem.sothenwhat.com/museum_photos/carousel/porsche21.jpg">
        <img src="http://diem.sothenwhat.com/museum_photos/carousel/porsche22.jpg">
        <img src="http://diem.sothenwhat.com/museum_photos/carousel/porsche23.jpg">
        <img src="http://diem.sothenwhat.com/museum_photos/carousel/porsche24.jpg">
        <img src="http://diem.sothenwhat.com/museum_photos/carousel/porsche25.jpg">
        '
    );  
      }
    ?>
    As you can see, that when a link is clicked, the parameter is retrieved from the data-gallery attribute and passed to the PHP script.
    The PHP script then reacts accordingly.
    In your setup, this would then be used to build the DB query, in mine I am just returning some images.

    Does that help?

  11. #36
    SitePoint Wizard donboe's Avatar
    Join Date
    Jun 2010
    Location
    Netherlands
    Posts
    2,117
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Pullo, it is coming very near to what I need indeed, but I try to understand the principle of what you have done, so I can translate it into Coldfusion. So I have a few questions:

    1. Is artwortk $gallery = $_GET['artwork']; in test3.php the mySql query?
    2. Can you please explain the following two lines in your script "var gallery = $(this).data("gallery");" and data: {artwork: gallery},


    I would be very greatful.
    “Good artists copy, great artists steal” (Pablo Picasso - 1934)

  12. #37
    Grüße aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,941
    Mentioned
    215 Post(s)
    Tagged
    12 Thread(s)
    Hi donboe,

    What is happening is that the JavaScript is listening for clicks on any anchor element.
    When a click takes place, it prevents the link's default action, then assigns the link's data-gallery attribute to a gallery variable.
    Example: If I click the "Porsche" link, then gallery holds the value "porsche". If I click "Hemmingway" then gallery holds the value "hemmingway".
    The JavaScript then executes an asynchronous GET request to test3.php.
    It assigns whatever value is held in the gallery variable to a new variable called artwork and passes that to the PHP script.
    In the PHP script this variable is available as $_GET['artwork'].
    The PHP script reads this value and returns a lump of HTML accordingly. I have hard-coded this HTML in my example, but you will want to do something a little bit more dynamic in your CF script.
    The main thing is, that the CF script returns different HTML (i.e. different pictures) for different values of $_GET['artwork'].
    Back in the JavaScript, we catch teh return value and initialize the carousel.

    Does that help?

  13. #38
    SitePoint Wizard donboe's Avatar
    Join Date
    Jun 2010
    Location
    Netherlands
    Posts
    2,117
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Pullo, I start to understand the principle , still leaves me with the question about the mySql query getArtwork that actually will return the photos! In which of the pages is that integrated. In test3.php?
    “Good artists copy, great artists steal” (Pablo Picasso - 1934)

  14. #39
    Grüße aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,941
    Mentioned
    215 Post(s)
    Tagged
    12 Thread(s)
    Hi,

    Are the images themselves stored in the DB or are they stored on the file system with a reference to them in the DB?

  15. #40
    SitePoint Wizard donboe's Avatar
    Join Date
    Jun 2010
    Location
    Netherlands
    Posts
    2,117
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Pullo. The images are stored in a folder in the root, the references are stored in the DB.
    “Good artists copy, great artists steal” (Pablo Picasso - 1934)

  16. #41
    Grüße aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,941
    Mentioned
    215 Post(s)
    Tagged
    12 Thread(s)
    In that case, couldn't you write something like this:

    Code PHP:
    <?php
    $tag= $_GET['artwork'];
     
    $sql= "SELECT * FROM images WHERE tag= :tag"; 
    $stmt = $pdo->prepare($sql);
    $stmt->bindParam(':tag', $tag, PDO::PARAM_STR); 
    $stmt->execute();
     
    while ($row = $stmt->fetchObject()) {
       echo "<img src='" . $row->path . "' />"
    }
    ?>

    Sorry I can't help you more with the ColdFusion.

  17. #42
    SitePoint Wizard donboe's Avatar
    Join Date
    Jun 2010
    Location
    Netherlands
    Posts
    2,117
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Pullo, this is going over my head to translate this to Coldfusion so I think I should go fo the PHP method instead to make this work. The code in your previous post is that complete or should i make adjustments. My CF query should normally look like:
    Code:
          	SELECT
            	M.museum_id
                  ,	M.museum_serie_dut
                  ,	M.museum_serie_eng
                  ,	M.museum_serie_name
                  , MP.photo
            FROM
            				museum  M
            INNER
            	JOIN  museum_photos MP
              	ON  M.museum_id = MP.museum_id
           	WHERE
            	museum_serie_name = <cfqueryparam cfsqltype="cf_sql_varchar" value="#Trim( Url.artwork )#" />
    How do I translate that into php. Another thing is that the carousel isn't working in your link, it just show the photo's in a couple of rows, should I add the jQuery plugin to the test3.php page instead?
    “Good artists copy, great artists steal” (Pablo Picasso - 1934)

  18. #43
    Grüße aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,941
    Mentioned
    215 Post(s)
    Tagged
    12 Thread(s)
    Hi donbe,

    The PHP code is incomplete, but I can make it work for you.

    Can you tell me:
    The name of the database.
    The name of the table where the paths of the images is stored.
    The column name containing the paths of the images.
    The column name containing the tag/identification for the various images (e.g. Hemmingway, Porsche etc.)
    An example path (e.g. /projects/diem/images/porsche1.jpg)

    Quote Originally Posted by donboe View Post
    Another thing is that the carousel isn't working in your link, it just show the photo's in a couple of rows.
    This I don't understand. The carousel is doing what it is supposed to as far as I can see.
    Or do you mean that you can't get it to work for you, on your PC?

    should I add the jQuery plugin to the test3.php page instead?
    No. The only job of test3.php is to return a lump of HTML containing the image tags.

  19. #44
    SitePoint Wizard donboe's Avatar
    Join Date
    Jun 2010
    Location
    Netherlands
    Posts
    2,117
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Pullo. The DB name is DIEMDB. The are two tables involved. The first one museum:
    Code:
    CREATE TABLE IF NOT EXISTS `museum` (
      `museum_id` tinyint(2) NOT NULL auto_increment,
      `museum_serie_dut` varchar(255) default NULL,
      `museum_serie_eng` varchar(255) default NULL,
      `museum_serie_name` varchar(255) default NULL,
      PRIMARY KEY  (`museum_id`)
    ) ENGINE=InnoDB  DEFAULT CHARSET=utf8;
    
    INSERT INTO `museum` (`museum_id`, `museum_serie_dut`, `museum_serie_eng`, `museum_serie_name`) VALUES
    (1, 'Porsche', 'Porsche', 'porsche'),
    (2, 'Hemmingway', 'Hemmingway', 'hemingway'),
    (3, 'Koeien', 'Cows', 'cows'),
    (4, 'Muiek', 'Music', 'music'),
    (5, 'Dieren', 'Animals', 'animals'),
    (6, 'Portretten', 'Portraits', 'portraits'),
    (7, 'Abstract', 'Abstract', 'abstract');
    and museum_photos:

    Code:
    CREATE TABLE IF NOT EXISTS `museum_photos` (
      `photo_id` smallint(2) NOT NULL auto_increment,
      `museum_id` tinyint(2) NOT NULL,
      `photo` varchar(255) default NULL,
      `photo_description_dut` varchar(255) default NULL,
      `photo_description_eng` varchar(255) default NULL,
      PRIMARY KEY  (`photo_id`),
      FOREIGN KEY (`museum_id`) REFERENCES `museum` (`museum_id`) ON DELETE CASCADE ON UPDATE NO ACTION
    ) ENGINE=InnoDB  DEFAULT CHARSET=utf8;
    
    
    INSERT INTO `museum_photos` (`photo_id`, `museum_id`, `photo`, `photo_description_dut`, `photo_description_eng`) VALUES
    (1, 1, 'porsche1.jpg', NULL, NULL),
    (2, 1, 'porsche2.jpg', NULL, NULL),
    (3, 1, 'porsche3.jpg', NULL, NULL),
    (4, 1, 'porsche4.jpg', NULL, NULL),
    (5, 1, 'porsche5.jpg', NULL, NULL),
    (6, 1, 'porsche6.jpg', NULL, NULL),
    (7, 1, 'porsche7.jpg', NULL, NULL),
    (8, 1, 'porsche8.jpg', NULL, NULL),
    (9, 1, 'porsche9.jpg', NULL, NULL),
    (10, 1, 'porsche10.jpg', NULL, NULL),
    (11, 1, 'porsche11.jpg', NULL, NULL),
    (12, 1, 'porsche12.jpg', NULL, NULL),
    (13, 1, 'porsche13.jpg', NULL, NULL),
    (14, 1, 'porsche14.jpg', NULL, NULL),
    (15, 1, 'porsche15.jpg', NULL, NULL),
    (16, 1, 'porsche16.jpg', NULL, NULL),
    (17, 1, 'porsche17.jpg', NULL, NULL),
    (18, 1, 'porsche18.jpg', NULL, NULL),
    (19, 1, 'porsche19.jpg', NULL, NULL),
    (20, 1, 'porsche20.jpg', NULL, NULL),
    (21, 1, 'porsche21.jpg', NULL, NULL),
    (22, 1, 'porsche22.jpg', NULL, NULL),
    (23, 1, 'porsche23.jpg', NULL, NULL),
    (24, 1, 'porsche24.jpg', NULL, NULL),
    (25, 1, 'porsche25.jpg', NULL, NULL),
    (26, 2, 'hemingway1.jpg', NULL, NULL),
    (27, 2, 'hemingway2.jpg', NULL, NULL),
    (28, 2, 'hemingway3.jpg', NULL, NULL),
    (29, 3, 'cow1.jpg', NULL, NULL),
    (30, 3, 'cow2.jpg', NULL, NULL),
    (31, 3, 'cow3.jpg', NULL, NULL),
    ...........
    ...........
    (71, 7, 'abstract6.jpg', NULL, NULL),
    (72, 7, 'abstract7.jpg', NULL, NULL),
    (73, 7, 'abstract8.jpg', NULL, NULL);
    Which are joind true museum_id

    There is no column holding the path, I usually have the path like: museum_photos/carousel/queryname.photo so the path is: museum_photos/carousel/photo.jpg

    The column name holding the tag/identification for the various images is museum_serie_name in the table museum.

    I hope this is all the information needed. Again thank you for all the help.
    “Good artists copy, great artists steal” (Pablo Picasso - 1934)

  20. #45
    Grüße aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,941
    Mentioned
    215 Post(s)
    Tagged
    12 Thread(s)
    Hi donboe,

    So using the SQL you supplied, I recreated the museum_photos table on my machine.
    For our purposes here, the museum table was irrelevant.

    I then updated the HTML, so that when you click on any of the links, the corresponding museum_id is passed to the PHP script.

    Code:
    <!DOCTYPE HTML>
    <html>
      <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>ColdFusion test</title>
        <style>img{ float:left;}</style>
      </head>
      
      <body>
        <a href="#" data-museum-id="1">Porsche</a>
        <a href="#" data-museum-id="2">Hemmingway</a>
    
        <div id="result"></div>
    
        <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
        <script type="text/javascript" src="http://diem.sothenwhat.com/js/jquery.waterwheelCarousel.js"></script>
        <script>
          $("a").on("click", function(e){
            e.preventDefault();
            var id = $(this).data("museum-id");
            $.ajax({
              type: "GET",
              url: "test4.php",
              data: {museum_id: id},
              cache: false,
              dataType: "html",
              success:function(res)  {
                $("#result").html(res);
                $("#result").waterwheelCarousel();
                $("#result").css({top:200});
              }
            });
          });
        </script>
      </body>
    </html>
    Then in test4.php I connect to the database, retrieve the museum_id from the $_GET array, query the database for the names of all photos associated with the museum_id, then iterate over them outputting an image tag for each one.

    PHP Code:
    <?php

    try
    {
      
    $pdo = new PDO('mysql:host=localhost;dbname=test''user',  'password');
    }
    catch (
    PDOException $e)
    {
      echo 
    'Unable to connect to the database server.';
      exit();
    }

    $museum_id$_GET['museum_id'];

    $sql"SELECT photo FROM museum_photos WHERE museum_id= :museum_id"
    $stmt $pdo->prepare($sql);
    $stmt->bindParam(':museum_id'$museum_idPDO::PARAM_STR); 
    $stmt->execute();

    while (
    $row $stmt->fetchObject()) {
      echo 
    "<img src='http://diem.sothenwhat.com/museum_photos/carousel/" $row->photo "' />";
    }
    Hope that helps you.

  21. #46
    SitePoint Wizard donboe's Avatar
    Join Date
    Jun 2010
    Location
    Netherlands
    Posts
    2,117
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Pullo, the pages are communicating with each other very well, I see some light on the horizon. I only can't get the carousel to work as it should as you can see here. The last question is that I need to add a hyperlink arround the images for the use of jQuery Lightbox. But I have no idea how to implement that into the echo? The image path for that is:

    Code:
    img src='http://diem.sothenwhat.com/museum_photos/photos/ . $row->photo
    Thank you in advance!
    “Good artists copy, great artists steal” (Pablo Picasso - 1934)

  22. #47
    Grüße aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,941
    Mentioned
    215 Post(s)
    Tagged
    12 Thread(s)
    Hey,

    That's good progress

    All we need to do now is to turn this:

    HTML Code:
    <img src="http://diem.sothenwhat.com/artwork/portrait1.jpg" />
    into this:

    HTML Code:
    <a href="http://diem.sothenwhat.com/artwork/portrait1.jpg" rel="lightbox"><img src="http://diem.sothenwhat.com/artwork/portrait1.jpg" /></a>
    You can do this in the PHP code.

    Change:

    PHP Code:
    echo "<img src='http://diem.sothenwhat.com/museum_photos/carousel/" $row->photo "' />"
    into:

    PHP Code:
    echo "<a href='http://diem.sothenwhat.com/museum_photos/carousel/" $row->photo "' rel='lightbox'><img src='http://diem.sothenwhat.com/museum_photos/carousel/" $row->photo "' /></a>"
    Does that work?

    N.B.: Don't forget to include the lightbox scripts on the page.

  23. #48
    SitePoint Wizard donboe's Avatar
    Join Date
    Jun 2010
    Location
    Netherlands
    Posts
    2,117
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Pullo that works great. I have the lightbox/fancybox scripts included and it is working. Leaves me with the carousel, which isn't working for me as yet. See the page. I had a look at jquery.waterwheelCarousel.js and they are reffering to a container called carousel, so I changed that in my test page but without any result as you will see
    “Good artists copy, great artists steal” (Pablo Picasso - 1934)

  24. #49
    Grüße aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,941
    Mentioned
    215 Post(s)
    Tagged
    12 Thread(s)
    Quote Originally Posted by donboe View Post
    Leaves me with the carousel, which isn't working for me as yet. See the page.
    Works for me in the latest Chrome.
    Which browser are you using and on which OS?

  25. #50
    SitePoint Wizard donboe's Avatar
    Join Date
    Jun 2010
    Location
    Netherlands
    Posts
    2,117
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    For me it is indeed working in Chrome and IE as well. but in Firefox on Windows it isn't. Is this a firefox thing?
    “Good artists copy, great artists steal” (Pablo Picasso - 1934)


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •