Note that there are some explanatory texts on larger screens.

plurals
  1. POmultiple onclicks for one function
    text
    copied!<p>I'm trying to write a photo gallery page where there are small icons of photo's below and when you click on them they enlarge into the main photo screen. only I'm having trouble trying to get the javascript to do what I want. Can anyone help me please?</p> <p>here's my code so far:</p> <pre><code>&lt;?php $host = "localhost"; $user = "root"; $pwd = ""; $db_name = "gallery"; mysql_connect($host, $user, $pwd)or die("cannot connect"); mysql_select_db($db_name)or die("cannot select DB"); $sql = mysql_query("SELECT * FROM foto ORDER BY id DESC LIMIT 10"); $id = 'id'; $foto = 'foto'; while ($rows = mysql_fetch_assoc($sql)) { echo "&lt;img class='littleshow'"."id='foto".$rows[$id]."'src='".$rows[$foto]."' onclick='Bigscreen(foto".$rows[$id].")'&gt;&lt;/img&gt;"; } //the onclick generates onclick="bigscreen(foto1)" and does this again 4 times on the other objects generating foto1,foto2,foto3,foto4 ?&gt; &lt;div id='bigshowcase'&gt;&lt;/div&gt; </code></pre> <p>and my Javascript so far:</p> <pre><code>function Bigscreen () { var div0 = document.getElementById('bigshowcase'); var images = new array(); images[0] = div0.style.backgroundImage = "url(pic/camera.jpg)"; images[1] = div0.style.backgroundImage = "url(pic/dsc_4255.jpg)"; images[2] = div0.style.backgroundImage = "url(pic/dsc_4373.jpg)"; images[3] = div0.style.backgroundImage = "url(pic/dsc01209.jpg)"; foto1 = images[0] foto2 = images[1] foto3 = images[2] foto4 = images[3] } </code></pre> <p>I know very little about javascript so most of this is probably wrong. thanks for helping :)</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload