remove toggle mode and close

PHP programming forum. Ask questions or help people concerning PHP code. Don't understand a function? Need help implementing a class? Don't understand a class? Here is where to ask. Remember to do your homework!

Moderator: General Moderators

Post Reply
Lauraw
Forum Newbie
Posts: 1
Joined: Tue Sep 21, 2010 3:31 am

remove toggle mode and close

Post by Lauraw »

Hi,

I have very low knowledge about php yet and only started to learn by customizing existing code. But I'm stuck with the next task I gave myself.

The existing code is toggling the images from thumb to full size. Like and on/off button for the images. But I would like to change it so there is only on image open at a time. you click on a thumbnail and the image opens and if you click on another thumbnail it closes the previous one and opens the clicked one.

I apologize as I can imagine this is quite annoying if total newbies ask this kind of stupid questions.

Thanks in advance
L

Here is the code:

Code: Select all

function createExhibit()
{
    $OBJ =& get_instance();
    global $rs, $exhibit;
    
    $pages = $OBJ->db->fetchArray("SELECT * 
        FROM ".PX."media, ".PX."objects_prefs, ".PX."objects  
        WHERE media_ref_id = '$rs[id]' 
        AND obj_ref_type = 'exhibit' 
        AND obj_ref_type = media_obj_type 
        AND id = '$rs[id]' 
        ORDER BY media_order ASC, media_id ASC");
        
    // ** DON'T FORGET THE TEXT ** //
    $s = $rs['content'];
    $s .= "\n<div class='cl'><!-- --></div>\n";

    if (!$pages) return $s;
    
    $thumb = $rs['thumbs'] + 20;
    
    $i = 1; $j = 0; $a = '';
    foreach ($pages as $go)
    {
        $title         = ($go['media_title'] == '') ? '&nbsp;' : $go['media_title'];
        $caption     = ($go['media_caption'] == '') ? '&nbsp;' : $go['media_caption'];
        
        if ($go['break'] != 0)
        {
            if ($i == $go['break'])
            {
                $i = 0;
                $break = "<div style='clear:left;'><!-- --></div>";
            }
            else
            {
                $break = '';
            }
        }
        else
        {
            $break = '';
        }
        
        // images
        $a .= "<div class='grow' id='img$j' style='float: left;'>\n";
        $a .= "<div class='thumb'>\n";
            $a .= "<div class='thumb-it'>\n";
                $a .= "<a href='#' class='thumb-img'   onclick=\"toggleImg($j,$go[media_x],$go[media_y],$go[thumbs]);return false;\"><img src='" . BASEURL . GIMGS . "/th-$go[media_file]' alt='$go[media_file]' title='$title' /></a>\n";
            $a .= "</div>\n";

            $a .= "</div>\n";
            $a .= "<strong>&nbsp;{$title}&nbsp;</strong>\n<em>&nbsp;{$caption}&nbsp;</em>\n";
          $a .= "</div>\n\n";
        
        $i++; $j++;
    }
    
    // images
    $s .= "<!--[if lte IE 6]><style type='text/css'>.thumb-img { #top: -50%; }</style><![endif]-->\n\n";
    $s .= "<div id='img-container'>\n";
    $s .= $a;
    $s .= "</div>\n";
        
    return $s;
}


function dynamicCSS()
{
    global $rs;
    
    // for .thumb-it we need #top: -50%; for IE...but it doesn't work.

    $thumb = $rs['thumbs'] + 20;
    
    return ".grow { float:left; }
    .thumb {  padding:0 5px 0 0; text-align:left; height: {$thumb}px; #position: relative; overflow: hidden; width: {$thumb}px; }

    .grow strong { margin-top: 3px; text-align: left; font-weight: normal; display: none; }
    .grow em { font-style: normal; display: none; text-align: left; }
    
    .thumb-it { #position: absolute; _top: 50%; display: table-cell; vertical-align: middle; text-align: left; }
    .thumb-img { #position: relative; width: {$thumb}px; display:block; }";
}


?>
Post Reply