SitePoint Sponsor |
|
User Tag List
Results 1 to 6 of 6
-
Apr 19, 2009, 07:49 #1
- Join Date
- Apr 2009
- Posts
- 3
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Why isn't my random image postitioning ?
Hi everybody,
I have a javascript that displays a random image whenever the page gets loaded but I can't seem to get the image on the right position...
I've got
Code:var gallery = new Array(); gallery[0] = new Array(new Array ("Image_01.jpg", "#01"), new Array ("Image_02.jpg", "#02")); function pickImageFrom(whichGallery) { var idx = Math.floor(Math.random() * gallery[whichGallery].length); document.write('<IMG STYLE="position:absolute; TOP:105px; LEFT:52px; WIDTH:249px; HEIGHT:150px"><a href="' + gallery[whichGallery][idx][1] + '"><img src="./Images/' + gallery[whichGallery][idx][0] + '"></a>'); }
Code:<script language="javascript">pickImageFrom(0);</script>
Is the positioning maybe possible with CSS ?
Thanks in advanceLast edited by JamieGreen; Apr 20, 2009 at 10:34.
-
Apr 19, 2009, 11:07 #2
- Join Date
- Jan 2007
- Location
- Christchurch, New Zealand
- Posts
- 14,729
- Mentioned
- 104 Post(s)
- Tagged
- 4 Thread(s)
Yes, the positioning issue is a css-related one. The good people in the css forum will be able to easily resolve that one for you.
Programming Group Advisor
Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
Car is to Carpet as Java is to JavaScript
-
Apr 19, 2009, 12:02 #3
- Join Date
- Apr 2009
- Posts
- 3
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Thanks for giving me a start but I already know how to position images in CSS, I don't know anything about Javascript.
So can you please give me one more hint ?
I think my CSS would be,
Code:#pickImageFrom(0){ position: absolute; left: 105; top: 52px; display:block; width: 150px; height: 249px; background: url("../Images/Image_01.jpg") 0 0 no-repeat; }
Code:<div class="pickImageFrom(0)"></div>
Thanks
-
Apr 19, 2009, 12:20 #4
- Join Date
- Jan 2007
- Location
- Christchurch, New Zealand
- Posts
- 14,729
- Mentioned
- 104 Post(s)
- Tagged
- 4 Thread(s)
That's not a class name, the # shows that it's an identifer instead.
Identifiers also aren't allowed to use parenthesis in their name.
http://www.w3.org/TR/html401/types.html#type-name
ID and NAME tokens must begin with a letter ([A-Za-z]) and may be followed by any number of letters, digits ([0-9]), hyphens ("-"), underscores ("_"), colons (":"), and periods (".").
The people in the css forum will be able to expand in much greater depth on the correct application of class names versus identifiers.Programming Group Advisor
Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
Car is to Carpet as Java is to JavaScript
-
Apr 20, 2009, 07:18 #5
- Join Date
- Apr 2009
- Posts
- 3
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Hmm, don't know what you mean actually, I've got 4 javascripts, each the same only with another number, but I use them like this
Code:<script language="javascript">pickImageFrom(0);</script> <script language="javascript">pickImageFrom(1);</script> <script language="javascript">pickImageFrom(2);</script> <script language="javascript">pickImageFrom(3);</script>
so I need to go with
Code:.pickImageFrom(0){ position: absolute; left: 105; top: 52px; display:block; width: 150px; height: 150px; background: url("../Images/Image_01.jpg") 0 0 no-repeat; }
and
Code:<div class="pickImageFrom(0)"> <a href="./mySite.h tml"></a> </div>
Thanks
-
Apr 20, 2009, 10:54 #6
- Join Date
- Jan 2007
- Location
- Christchurch, New Zealand
- Posts
- 14,729
- Mentioned
- 104 Post(s)
- Tagged
- 4 Thread(s)
That's a good idea. They'll be able to more effectively teach you about proper use of class names.
Programming Group Advisor
Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
Car is to Carpet as Java is to JavaScript
Bookmarks