I have an html question. I’m using sharepoint – working on Sharepoint Designer. I’m trying to combine to elements as one that are currently working separately.
I’m new to html so please excuse my lack of cohesion in forming this question.
Page one. I’m using a function to select between 3 different images
function changeIt(imageName,objName)
{
var obj = document.getElementById(objName);
the if statement below is just how i've been trying to toggle between visible and not based on a certain criteria:
//************
if (imageName == 'http://office-na.ms.com/ops/SecuritiesOperations/Images1/NoneSelected.JPG')
{
document.getElementById('falseyear').style.display = 'block';
}
else
{
document.getElementById('falseyear').style.display = 'none';
}
//**************
var imgTag = "<img src='"+imageName+"' border='0' />";
obj.innerHTML = imgTag;
return;
}
/script>
</head>
<body>
<a id="one" href="#" onclick="changeIt('http://office-na.com/NoneSelected.JPG','image1');">Main</a>
<a id="two" href="#" onclick="changeIt(,http://office-na.com/PlanningSelected.JPG','image1');">Planning</a>
<a id="three" href="#" onclick="changeIt('http://office-na.com/RequirementSelected.JPG','image1');">Requirement</a>
<div id="image1">
<img src="http://office-na.com/NoneSelected.JPG" border="0" alt="one" usemap="#FPMap0" />
</div>
<div id="falseyear" style="display:none"><h3>The year you entered is not valid</h3></div>
<br/><br/>
</body>
</html>
//For the second part is I’ve set up hotspots(hyperlinks) for one of the images as follows
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled 1</title>
</head>
<body>
<p><map name="FPMap0" id="FPMap0">
<area title="Click to follow hyperlink" href="http://office-na.ms.com/Templates/Blank%20Template.doc" shape="rect" coords="760, 490, 889, 514" />
<area title="click to follow hyperlink" href="http://office-na.ms.com/Templates/Small%20Template.ppt" shape="rect" coords="760, 512, 889, 537" />
<area title="click to follow hyperlink" href="http://office-na.ms.com/Templates/Large%20Template.ppt" shape="rect" coords="760, 536, 891, 560" />
<area title="Click to follow hyperlink" href="http://office-na.ms.com/Templates/Blank%20Template.ppt" shape="rect" coords="760, 575, 890, 598" />
</map>
<img alt="Practice" src="Best.jpg" width="960" height="720" usemap="#FPMap0" /></p>
</body>
</html>
I would like to combine the two and make it so that I can add hotspots depending on which image is selected in section one. So is there a way to add/change the map hyperlinks depending on which image is selected? That is why I added the if statement in the first section to see if I could toggle on and off something based on a criteria. Is this something that can be done in html? if not what language should I be looking into? asp.net? Javascript?
Thanks for taking the time to read and reply,
Hi All so I’ve pieced together a solution. Probably not the best but it works
I’ve created two document libraries with the hotlinks that link to one another and also have the hotlinks for the files (dox,ppt etcetra) that are necessary for each unique image (plan & Require) in a templates folder. I know there has to be a more elegant way of doing this. But wanted to share the solution.
Thanks to so many for looking at the question although there weren’t any comments/proposed answers..tumbleweed..