Solved

loading images

Posted on 2003-10-27
6
156 Views
Last Modified: 2010-04-09
currently if have a pretty long routine to load customer logo's.
i am loading them into a table format loading individual images by name.
it becomes a problem when i have to load new ones, because i have to rewrite the page to keep the order correct.

is there a way to read a directory that the images are in and load them in alpha order?

current code.
 <td class="td_maintext">
            <table border="0" cellspacing="10" cellpadding="0">
              <tr>
                <td><img src="images/a1.jpg" width="99" height="96"></td>
                <td><img src="images/a2.jpg" width="99" height="96"></td>
                <td><img src="images/a3.jpg" width="99" height="96"></td>
                <td><img src="images/a4.jpg" width="99" height="96"></td>
              </tr>
              <tr>
                <td><img src="images/a5.jpg" width="99" height="96"></td>
                <td><img src="images/a6.gif" width="99" height="96"></td>
                <td><img src="images/a7.jpg" width="99" height="96"></td>
                <td><img src="images/a8.jpg" width="99" height="96"></td>
              </tr>
              <tr>
           
and so on
thanks for any help
0
Comment
Question by:jafrazee
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
6 Comments
 
LVL 7

Expert Comment

by:Xxavier
ID: 9630931
Try this

<td class="td_maintext">
            <table border="0" cellspacing="10" cellpadding="0">
              <tr>
                <td><img  width="99" height="96"></td>
                <td><img  width="99" height="96"></td>
                <td><img  width="99" height="96"></td>
                <td><img  width="99" height="96"></td>
              </tr>
              <tr>
                <td><img  width="99" height="96"></td>
                <td><img  width="99" height="96"></td>
                <td><img  width="99" height="96"></td>
                <td><img  width="99" height="96"></td>
              </tr>
              <tr>



             <table>

<script>
ImArray= new Array("images/a1.jpg","images/a2.jpg","images/a3.jpg",  ..etc )
for (i=0;i<=document.images.length-1;i++)
   {document.images[i].src=ImArray[i]}
</script>
0
 
LVL 2

Author Comment

by:jafrazee
ID: 9631199
the array loads onto the web document but does not load into my table.
am i missing a step?
0
 
LVL 7

Expert Comment

by:Xxavier
ID: 9642282
Show me your code.
0
 

Accepted Solution

by:
BakaMattSu earned 50 total points
ID: 9827918
Xxavier's suggestion will work, but only assuming the code you've given is all that's on your page. Just modify it as follows to specifically target the images in your table, and it should load properly again:

<table border="0" cellspacing="10" cellpadding="0">
              <tr>
                <td><img id="logo0"  width="99" height="96"></td>
                <td><img id="logo1"  width="99" height="96"></td>
                <td><img id="logo2"  width="99" height="96"></td>
                <td><img id="logo3" width="99" height="96"></td>
              </tr>
              <tr>
                <td><img id="logo4"  width="99" height="96"></td>
                <td><img id="logo5"  width="99" height="96"></td>
                <td><img id="logo6"  width="99" height="96"></td>
                <td><img id="logo7"  width="99" height="96"></td>
              </tr>
              <tr>
<table>

<script>
ImArray= new Array("images/a1.jpg","images/a2.jpg","images/a3.jpg",  ..etc )
for (i=0;i<ImArray.length;i++) {
     document.images["logo"+i].src=ImArray[i];
}
</script>
0

Featured Post

On Demand Webinar - Networking for the Cloud Era

This webinar discusses:
-Common barriers companies experience when moving to the cloud
-How SD-WAN changes the way we look at networks
-Best practices customers should employ moving forward with cloud migration
-What happens behind the scenes of SteelConnect’s one-click button

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article describes how to create custom column layout styles for Bootstrap. The article uses 5 columns to illustrate the concept, but the principle can be extended to any number of columns.
Is your Office 365 signature not working the way you want it to? Are signature updates taking up too much of your time? Let's run through the most common problems that an IT administrator can encounter when dealing with Office 365 email signatures.
In this Micro Tutorial viewers will learn how to create navigation buttons that change on rollover, using CSS (Continuation of the CSS Image Sprite tutorial) Create a parent ID for all the list items       - Specify position: absolute and display: block…
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).

691 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question