Title: Creating Javascript array in loop
Last modified: August 19, 2016

---

# Creating Javascript array in loop

 *  [Arsene](https://wordpress.org/support/users/arsene/)
 * (@arsene)
 * [16 years, 4 months ago](https://wordpress.org/support/topic/creating-javascript-array-in-loop/)
 * Hi,
 * after hours of googling I decided to post a new thread. I use onmouseover “galleries”
   in my loop – and they ar (of course) working just great if there is just one 
   post [ [http://petrcibulka.freshflesh.cz/?cat=2](http://petrcibulka.freshflesh.cz/?cat=2),
   just onmouseover on numbers bellow “current web project” header ]. Images are
   provided by custom fields.
 * The problem is that sript can’t recognize that he needs to generate new “gallery”
   because there is a new post. Sorry for not using proper words, but I think this
   is the better way to understand the problem. And here goes the code [ [http://petrcibulka.freshflesh.cz/?cat=3](http://petrcibulka.freshflesh.cz/?cat=3)]:
 *     ```
       <!--script for "gallery"-->
   
       <script type="text/javascript">
   
       	var aryImages = new Array(1);
       	var selIndex = 0;
   
       	aryImages[0] = "<?php $thumb = get_post_meta($post->ID, 'Image0', $single = true); if($thumb !== '')
       						{ echo ''. $thumb .''; }
       					?>"
       	aryImages[1] = "<?php $thumb = get_post_meta($post->ID, 'Image1', $single = true); if($thumb !== '')
       						{ echo ''. $thumb .''; }
       					?>"
   
       	for (i=0; i > aryImages.length; i++) {
       		var preload = new Image();
       		preload.src = aryImages[i];
       	}
   
       	function swap(imgIndex, imgTarget) {
       		document[imgTarget].src = aryImages[imgIndex];
       		selIndex = imgIndex;
       	}
   
       </script>
   
       <!-- Code inside the loop, let's say it concerns three posts-->
   
       <table><tr>
   
       <table><tr>
       	<td>
       		<a href="<?php the_permalink(); ?>"><?php $thumb = get_post_meta($post->ID, 'Image0', $single = true); if($thumb !== '')
       			{ echo '<img src="'. $thumb .'" alt="dynamic" name="imgDefault" width="380" height="380" border="0" />'; }
       		?></a>
       	</td><td>
       		<span onclick="swap(0, 'imgDefault')" onmouseover="swap(0, 'imgDefault')" class="gal">
       			<?php $thumb = get_post_meta($post->ID, 'Image0', $single = true); if($thumb !== '')
       				{ echo '&nbsp;1&nbsp;'; }
       			?>
       		</span>&nbsp;
       		<span onclick="swap(1, 'imgDefault')" onmouseover="swap(1, 'imgDefault')" class="gal">
       			<?php $thumb = get_post_meta($post->ID, 'Image1', $single = true); if($thumb !== '')
       				{ echo '&nbsp;2&nbsp;'; }
       			?>
       		</span>&nbsp;
           </td>
       </tr></table>
       ```
   
 * As you can see, “gallery” works just for last post. Any suggestions? I don’t 
   stick to this particular sollution of Javascript array but I don’t want to use
   any plugin for this and get it work just with custom fields. As far as I know,
   common onmouseover atribute doesn’t work “distantly” – and I need to change the
   image which is outside the tag (no matter if anchor or span tag).
 * Any help would be very superappreciated.

Viewing 3 replies - 1 through 3 (of 3 total)

 *  Thread Starter [Arsene](https://wordpress.org/support/users/arsene/)
 * (@arsene)
 * [16 years, 4 months ago](https://wordpress.org/support/topic/creating-javascript-array-in-loop/#post-1334983)
 * And one more thing: I tried to make “galleries” more unique by ithe_ID() tag 
   and it didn’t work really well. At least I have unique names for images.
 *     ```
       <!--The image which should be changed-->
   
       <?php $thumb = get_post_meta($post->ID, 'Image0', $single = true); if($thumb !== '')
       	{ echo '<img src="'. $thumb .'" alt="dynamic" width="380" height="380" name="imgDefault'; }
       ?>
       <?php the_ID(); ?>
       <?php $thumb = get_post_meta($post->ID, 'Image0', $single = true); if($thumb !== '')
       	{ echo '" />'; }?>
       ?>
   
       <!--Spans with numbers-->
   
                               <span onclick="swap(0, 'imgDefault<?php the_ID(); ?>')" onmouseover="swap(0, 'imgDefault<?php the_ID(); ?>')" class="gal">
                                   <?php $thumb = get_post_meta($post->ID, 'Image0', $single = true); if($thumb !== '')
                                       { echo '&nbsp;1&nbsp;'; }
                                   ?>
                               </span>&nbsp;
                               <span onclick="swap(1, 'imgDefault<?php the_ID(); ?>')" onmouseover="swap(1, 'imgDefault<?php the_ID(); ?>')" class="gal">
       							<?php $thumb = get_post_meta($post->ID, 'Image1', $single = true); if($thumb !== '')
                                       { echo '&nbsp;2&nbsp;'; }
                                   ?>
       ```
   
 *  Thread Starter [Arsene](https://wordpress.org/support/users/arsene/)
 * (@arsene)
 * [16 years, 4 months ago](https://wordpress.org/support/topic/creating-javascript-array-in-loop/#post-1335134)
 * Anyone?
 *  [eucopyright](https://wordpress.org/support/users/eucopyright/)
 * (@eucopyright)
 * [15 years, 6 months ago](https://wordpress.org/support/topic/creating-javascript-array-in-loop/#post-1335351)
 * Use the raw html plugin, then put your javascript in between the tags…
 * [raw]
 * <script type=”text/javascript”>
    You Script; </script>
 * [/raw]
 * WARNING =-> You cannot use the visual editor to open the page ever… or it’s screwed
   and cannot be fixed!

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Creating Javascript array in loop’ is closed to new replies.

## Tags

 * [array](https://wordpress.org/support/topic-tag/array/)
 * [javascript](https://wordpress.org/support/topic-tag/javascript/)
 * [loop](https://wordpress.org/support/topic-tag/loop/)

 * 3 replies
 * 2 participants
 * Last reply from: [eucopyright](https://wordpress.org/support/users/eucopyright/)
 * Last activity: [15 years, 6 months ago](https://wordpress.org/support/topic/creating-javascript-array-in-loop/#post-1335351)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics