JavaScript/HTML Help

9 posts / 0 new
Log in or register to post comments
Last post
Wed, 2011-02-23 22:40
#1
djrikki
djrikki's picture
Offline
Last seen: 3 years 7 months ago
Joined: 2011-01-14 23:02
JavaScript/HTML Help

Evening,

Instead of subscribing to yet another random javascript forum I was hoping someone here on this forum can help solve a small dilemma.

I am trying inject the Title property of an anchor with html escape codes using javascript so it would like this:

title='<a href="">example.html<a>'

The Javascript:

  1. document.getElementById('lista' + a).title = "<a href="" + category[phpcat][a+offset][5] + ".jpg" + "">Click here to save the image</a>";

Now when the function is called to display this title it is actually printing the whole string like below:

  1. <a href="http://www.amigaos.net/customise/background17.jpg">Click here to save the image</a>

Instead of displaying: Click here to save the image

When passing the variable across to the Title property it appears to translating the &codes first rather than leaving them intact.

This is the page I am trying to fix:

http://www.amigaos.net/customise.php?category=0

Simply click any of the background images in the gallery, you will probably have to scroll down your screen to see the caption at the bottom because I haven't changed the zoom level yet in the lightbox css.

As you can see this is a Lightbox javascript extension.

http://www.lokeshdhakar.com/projects/lightbox2/

This page goes on to explain how it is done, but only for static data, but dynamic data.

http://www.lokeshdhakar.com/projects/lightbox2/

With static data it works fine, but not if I try and pass a javascript variable into the Title property.

Top
Wed, 2011-02-23 23:14
marko
marko's picture
Offline
Last seen: 9 years 1 month ago
Joined: 2010-11-30 15:48
<html><head></head><body> <a 
  1. <html>
  2. <head></head>
  3. <body>
  4. 	<a id="something" />
  5.  
  6. 	<script type="text/javascript">
  7. 		document.getElementById('something').href = "http://www.amigaos.net/customise/background17.jpg";
  8. 		document.getElementById('something').innerHTML = "Click here to save the image";
  9. 	</script>
  10. </body>
  11. </html>

__________________
m4rko.com/AMIGA

Top
Thu, 2011-02-24 00:41
(Reply to #2)
djrikki
djrikki's picture
Offline
Last seen: 3 years 7 months ago
Joined: 2011-01-14 23:02
Remember the property I am

Remember the property I am trying to change is .title not href, and surround the href (inside the title) with an anchor.

  1. document.getElementById('lista' + a).title = "&lt;a href=&quot;" + category[phpcat][a+offset][5] + ".jpg" + "&quot;&gt;Click here to save the image&lt;/a&gt; &nbsp; &lt;b&gt;Image&lt;/b&gt by " + category[phpcat][a+offset][1];

The .href is the jpg being open by LightBox, .title is the captioned text inside the LightBox.

AmigaOS.net - Discover Amiga, Discover AmigaOS.net
Jack for AmigaOS
Samba Idiot's Guide

Top
Sun, 2011-02-27 18:01
(Reply to #3)
djrikki
djrikki's picture
Offline
Last seen: 3 years 7 months ago
Joined: 2011-01-14 23:02
Well still no luck here

Well still no luck here fixing the final remaining pages of my site.

http://www.amigaos.net/customise.php?category=0

My have to just do away with the caption inside the lightbox and instead have 2 additional fields under each listing.

AmigaOS.net - Discover Amiga, Discover AmigaOS.net
Jack for AmigaOS
Samba Idiot's Guide

Top
Sun, 2011-02-27 20:03
(Reply to #4)
djrikki
djrikki's picture
Offline
Last seen: 3 years 7 months ago
Joined: 2011-01-14 23:02
SOLVED! Went against my

SOLVED! Went against my better judgement, inserted html code directly into .title property instead of special entities works a treat.

AmigaOS.net - Discover Amiga, Discover AmigaOS.net
Jack for AmigaOS
Samba Idiot's Guide

Top
Sun, 2011-03-20 22:25
(Reply to #5)
djrikki
djrikki's picture
Offline
Last seen: 3 years 7 months ago
Joined: 2011-01-14 23:02
Hi all, Perhaps someone can

Hi all,

Perhaps someone can fix a javascript function for me, it supposed to sort an array by the 6th element (the datestamp) - it works correctly in Safari, but displays nothing in FF. :o

function sortByColumn(a,b) {
a = a[6];
b = b[6];
return a == b ? 0 : (a > b ? -1 : 1)
}

Calling it like this: article.sort(sortByColumn); shows sorted list in Safari, nothing in FF

Curiously if I call it like: article.sort(sortByColumn()); Safari now shows an unsorted list as does FF.

As I have lifted the code from another site, I don't fully appreciate it how it works, but suffice to say the result isn't ideal. ^.^

Array structure below.

Online page resource: http://www.amigaos.net/articles.php

  1. article[0][0] = 'Timberwolf (FireFox 4.0 port)'; // title
  2. article[0][1] = 'thumbs/searchweb.png'; // icon
  3. article[0][2] = "Timberwolf is the name of the AmigaOS 4.x port of Mozilla's Firefox browser.  Currently based on FireFox 3.5.4 this finally " +
  4. 				"bridges the gap for AmigaOS users when it comes to competent web browsing.\n\n" +
  5. 				"Timberwolf is currently an Alpha release so expect plenty of bugs, the developers behind Mozilla hope to release FireFox 4.0 by late " +
  6. 				"Autumn 2010.  The Timberwolf port should be with us Q2/2011."; //article
  7.  
  8. article[0][3][0] = 'http://os4depot.net/share/network/browser/timberwolf_install.lha|Download Timberwolf Alpha 1'; //links
  9. article[0][3][1] = 'http://www.friedenhq.org/index.php" target="_BLANK|Find out more about the project'; //links
  10. article[0][3][2] = ''; //links
  11.  
  12. article[0][4] = 'images'; // images or videos
  13.  
  14. article[0][5][0] = 'apps/timberwolf_getting_started';
  15. article[0][5][1] = 'apps/timberwolf_html5_video';
  16. article[0][5][2] = 'media/timberwolf5';
  17. article[0][5][3] = 'media/timberwolf7';
  18. article[0][5][4] = '';
  19. article[0][5][5] = '';
  20.  
  21. article[0][6] = '2010-06-13T15:51:41+00:00'; // article date
  22. article[0][7] = 'timberwolf'; // title short name
  23.  
  24. article[1][0] = 'AmiDark Engine (Game Development Kit)'; // title
  25. article[1][1] = 'thumbs/edit.png'; // icon
  26. article[1][2] = "AmiDark Engine is a Game Development Kit for AmigaOS 4.1. &nbsp;Its programmer Frederic Cordier has been working tirelessly over the last " +
  27. 				"18 months to bring this amazing GDK to the next generation Amiga platform.\n\n" +
  28. 				"Inspired by DarkBASIC, DarkBASIC Professional and DarkGDK by the TheGamesCreators when complete this great application will allow " + 
  29. 				"software programmers to rapidly create video games under Amiga OS 4.1 as well as bring existing titles to the platform.\n\n" +
  30. 				"At the time of writing the AmiDark Engine reached Alpha state, hopefully (fingers crossed) we will see a full release by the end of the " +
  31. 				"year."; //article
  32.  
  33. article[1][3][0] = 'http://www.amidark-engine.com|Find our more about AmiDark Engine'; //links
  34. article[1][3][1] = ''; //links
  35. article[1][3][2] = ''; //links
  36.  
  37. article[1][4] = 'videos'; // images or videos
  38.  
  39. article[1][5][0] = 'media/amidark/0|19bzR3cq520';
  40. article[1][5][1] = 'media/amidark/1|dqh3ef_urqU';
  41. article[1][5][2] = '';
  42. article[1][5][3] = '';
  43. article[1][5][4] = '';
  44. article[1][5][5] = '';
  45.  
  46. article[1][6] = '2010-07-14T15:51:41+00:00'; // article date
  47. article[1][7] = 'amidark'; // title short name
  48.  
  49. .... etc

AmigaOS.net - Discover Amiga, Discover AmigaOS.net
Jack for AmigaOS
Samba Idiot's Guide

Top
Wed, 2011-03-23 23:06
(Reply to #6)
djrikki
djrikki's picture
Offline
Last seen: 3 years 7 months ago
Joined: 2011-01-14 23:02
So anyone got a solution yet?

So anyone got a solution yet?

AmigaOS.net - Discover Amiga, Discover AmigaOS.net
Jack for AmigaOS
Samba Idiot's Guide

Top
Wed, 2011-03-23 23:47
(Reply to #7)
djrikki
djrikki's picture
Offline
Last seen: 3 years 7 months ago
Joined: 2011-01-14 23:02
Updated article[0] to remove

Updated article[0] to remove target="blah blah" error:

  1. article[0][0] = 'Timberwolf (FireFox 4.0 port)'; // title
  2. article[0][1] = 'thumbs/searchweb.png'; // icon
  3. article[0][2] = "Timberwolf is the name of the AmigaOS 4.x port of Mozilla's Firefox browser.  Currently based on FireFox 3.5.4 this finally " +
  4. 				"bridges the gap for AmigaOS users when it comes to competent web browsing.\n\n" +
  5. 				"Timberwolf is currently an Alpha release so expect plenty of bugs, the developers behind Mozilla hope to release FireFox 4.0 by late " +
  6. 				"Autumn 2010.  The Timberwolf port should be with us Q2/2011."; //article
  7.  
  8. article[0][3][0] = 'http://os4depot.net/share/network/browser/timberwolf_install.lha|Download Timberwolf Alpha 1'; //links
  9. article[0][3][1] = 'http://www.friedenhq.org/index.php|Find out more about the project'; //links
  10. article[0][3][2] = ''; //links
  11.  
  12. article[0][4] = 'images'; // images or videos
  13.  
  14. article[0][5][0] = 'apps/timberwolf_getting_started';
  15. article[0][5][1] = 'apps/timberwolf_html5_video';
  16. article[0][5][2] = 'media/timberwolf5';
  17. article[0][5][3] = 'media/timberwolf7';
  18. article[0][5][4] = '';
  19. article[0][5][5] = '';
  20.  
  21. article[0][6] = '2010-06-13T15:51:41+00:00'; // article date
  22. article[0][7] = 'timberwolf'; // title short name

Still now working so that wasn't it.

AmigaOS.net - Discover Amiga, Discover AmigaOS.net
Jack for AmigaOS
Samba Idiot's Guide

Top
Thu, 2011-03-24 01:35
(Reply to #8)
djrikki
djrikki's picture
Offline
Last seen: 3 years 7 months ago
Joined: 2011-01-14 23:02
Seen as though I couldn't

Seen as though I couldn't find a way to do it with Javascript, articles are now stored in a .csv file which is read when the page is loaded and echoed to the page. Just gotta remedy prev/next page buttons now on this page and carry through the changes to the associated getarticles.php page.

AmigaOS.net - Discover Amiga, Discover AmigaOS.net
Jack for AmigaOS
Samba Idiot's Guide

Top
Log in or register to post comments