How do I reference an image in JavaScript using the 'src' attribute? - html

I am attempting to display a traffic light image by referencing its source using the 'src' attribute but when ever I try to run it, it just displays the alt heading.
<!DOCTYPE html>
<html>
<body>
<img src = "Pictures/Computing/Question3Images/red_light1.jpg" alt = "Traffic light 1">
</body>
</html>
This is the little extract of what I have got so far but it is only displaying the alt heading "Traffic light 1". I am new to this coding and so am aware that it is most likely not what it needs to be but can anyone please tell me what I have done wrong or what I need to add.
Thanks

probably the image does not exists in the path you have defined, thats why the browser displayed the value which is in 'alt' attribute of 'img' tag .

Related

How to use a link as image title in html

I made attempt and tried to find my goal But I couldn't and found solution like this that didn't benefit for me!
I have <img src="url" title="ali.com"> I want to make ali.com a link. I used
title=ALI.com but doesn't work! any way?
The title attribute accepts only plain text, you cannot have any markup there.
If you want a tooltip with a link inside (and I'd urge you not to as it is a difficult UI to use), then you'll need to build the whole thing with JavaScript and DOM.
Above answers suffices your requirement, but specific to your use case :
<img src="image url" title="ali.com"/>
You can use url as a title (google.com?d=1&e=2 this is string)
You need to run little js code to achieve final goal
put something like this html
<a class="mylink"> <img title="blahblah" scr =""></img></a>
and you can get title string by
yourtitlestring = $(".mylink img").attr("title")
and now you can set href of link
$(".mylink").setAttribute("href", yourtitlestring);

HTML unable to open image despite correct location

I am having some trouble open a image (jpg) on the browser despite correct location. The rest of the image located in the folder are able to open.
I need some advise or diction how to approach this issue.
Link 1 --> Show my FTP
http://postimg.org/image/g3lofgv8r/
Link 2 --> Show the dictionray
http://postimg.org/image/7nw24mw81/
Did you try to url encode the value in the src-attribute of your image tag? (I find this link useful for a quick check: http://www.w3schools.com/tags/ref_urlencode.asp)
Like when your image filename is
<img src="spaces and + sign in url.jpg" />
you would encode it with
<img src="spaces+and+%2B+sign+in+url.jpg" />
Issue looks to me is the Space between name of image...either remove space or use underscore(_)...

How to parse html code to get image src

I have html code in which image tag is used.. I want to get the src of image ..
One idea is that...i split that code :
var temp=htmlContent.split("<img src='")[1];
var imageURL=temp.split("'")[0];
but There is no gurantee that src would be the first attribute of img tag....like this
<img alt="image" src="url"/>
So please give me some feasible solution for Google Apps Script
// parses implicitly as "<html><body><img alt='alt' src='source!'></body></html>"
Xml.parse("<img alt='alt' src='source!'>", true).getElement()
.getElements()[0] // descend into <html>
.getElements()[0] // descend into <body>
.getAttribute('src').getValue(); // get the value of the 'src' attribute
To explain, Xml.parse with the second param as true parses the text as a lenient HTML document. It implicitly adds an <html> tag and a <body> tag which you need to descend into with the .getElements()[0].getElements()[0] calls. Then you are at the <img> tag and you can examine its src attribute without worrying about where it is in the tag.

HTML.link from a frame to another opens in new window?How can i fix it?

i want to have a link in frame a and open in frame b without opening new window.
heres my code:
<html>
<base target="main.htm">
<body>
<body link="blue" vlink="rgb(255,200,0)" alink="green" style="background-color:rgb(255,30,15)">
<h2><b>ΠΕΡΙΕΧΟΜΕΝΑ</b></h2>
ΠΡΟΣΩΠΙΚΑ ΣΤΟΙΧΕΙΑ <br/>
<body/>
<html/>
Firstly I would suggest a valid doctype declaration, unless of course you're going for HTML5.
Secondly, I would suggest your enclose your <base> tag inside <head></head> tag
Thirdly, if you're using either XHTML or HTML 5 (as it seems you're currently doing), you will need to close your <base> tag with </base>
As for answering your actual question, you'll need to use the target attribute, as follows:
<base target="main.htm" target="_parent">
Please note that, as far as I know you can't have a link from Frame A open in Frame B, unless it's a parent frame - if you understand what I mean. To get a full understanding of what the target attribute does, check out this link.

How do I add html link to image title

I'm actually needing to include html links in the longdesc attribute. I've altered prettyphoto to use longdesc instead of title for images, but I need to include html links in those descriptions. I know it's possible with code for characters, I just don't remember what those are.
Thanks
This can be done with the longdesc attribute:
<img src="theimage.png" longdesc="thedescription.html" />
And then, in thedescription.html:
Link
One alternative way to do this is by using an OBJECT element, as follows:
<OBJECT data="theimage.png" type="image/png">
Link
</OBJECT>
Also, since you asked for it, here is how to convert html entities automatically in jquery:
$('<div/>').text('Some Link').html();
// the above evaluates to <a href="link.html">Some Link</a>
I'm not sure if this is what you're looking for, but you can use Walter Zorn's wz_tooltip to show a tooltip with any kind of content.
And example of use:
<img src="theimage.png" onmouseover="Tip('<a href=\'http://test.com/\'>Link</a>');" onmouseout="UnTip();">
The longdesc attribute is an URI, not a place to add code. In other words, you'll need to create a page that the longdesc links to. This page is where you'll make a thorough description of what's on the image.
Are you looking for the html entities?
If so, these are what you are looking for:
> = >
< = <
" = "
' = '