Solved

How to put 3 icons in a bar in a website using a javascript

Posted on 2014-11-18
4
119 Views
Last Modified: 2014-11-18
Dear Experts,

I have a bar drawn on my website (see picture) that I have put as attachement. The bar with the date and the word "Contact" is the
bar that I am talking about. The bar is drawn throug a javascript. What I would like in the bar is instead of the word "Contact" I
would like the 3 icons displayed just like experts-exchange has (the mail icon, the notification icon and the suitcase icon). How can
I do that. Does someone knows the answer and is willing to help me.

<!-- Begin

var showdate	= "yes"		// SHOW THE DATE ON THE PAGE
var showbar2	= "yes"		// SHOW THE DATE ON THE PAGE

document.write('<table cellpadding="0" cellspacing="0" border="0" width="100%" class="headerbar"><tr><td align="left" class="printhide">');


// START DATE SCRIPT

   if (showdate == "yes") {

document.write('<div id="date-location">');
var d=new Date();
var weekday=new Array("Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday");
var monthname=new Array("January","February","March","April","May","June","July","August","September","October","November","December");
document.write("<span class=\"date-font\"><nobr>" + weekday[d.getDay()] + ", ");

document.write(monthname[d.getMonth()] + " ");

document.write(d.getDate() + ", ");

document.write(d.getFullYear());
document.write("</nobr><br></span>");
document.write('</div>');
}
else {
document.write('&nbsp;<br>');
}

document.write('</td><td align="right">');

document.write('<div id="contact-location">');

document.write('<a href="contact.htm" class="barlink">Cont@ct</a><br>');

document.write('</div>');

document.write('</td></tr></table>');

if (showbar2 == "yes") {
document.write('<table cellpadding="0" cellspacing="0" border="0" width="100%" class="headerbar2"><tr><td class="printhide">');
document.write('<img src="picts/spacer.gif" height="2" width="2" border="0"><br>');
document.write('</td></tr></table>');
}

//  End -->

Open in new window


Greetings, Peter Kiers
Example.png
0
Comment
Question by:peterkiers
[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
  • 2
4 Comments
 
LVL 19

Expert Comment

by:Greg Alexander
ID: 40450000
Assuming you are not using an icon pack, and you have the icons as images you could simply change

document.write('<a href="contact.htm" class="barlink">Cont@ct</a><br>');

Open in new window


to

document.write('<img src="the_path_to_image1.jpg" alt="img_name"><img src="the_path_to_image2.jpg" alt="img_name"><img src="the_path_to_image3.jpg" alt="img_name"><br>');

Open in new window

0
 
LVL 1

Author Comment

by:peterkiers
ID: 40450078
Oke thanks. What's the code when the user clicks on the picture is should load another webpage. What's the code for  that. Grtz, Peter
0
 
LVL 19

Accepted Solution

by:
Greg Alexander earned 500 total points
ID: 40450087
Add some link tags around the image like so:

document.write('<a href="http://google.com"><img src="the_path_to_image1.jpg" alt="img_name"></a><a href="http://google.com"><img src="the_path_to_image2.jpg" alt="img_name"></a><a href="http://google.com"><img src="the_path_to_image3.jpg" alt="img_name"></a><br>');
0
 
LVL 1

Author Comment

by:peterkiers
ID: 40450104
Thanks. Peter
0

Featured Post

On Demand Webinar: Networking for the Cloud Era

Ready to improve network connectivity? Watch this webinar to learn how SD-WANs and a one-click instant connect tool can boost provisions, deployment, and management of your cloud connection.

Question has a verified solution.

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

This article discusses how to create an extensible mechanism for linked drop downs.
Boost your ability to deliver ambitious and competitive web apps by choosing the right JavaScript framework to best suit your project’s needs.
HTML5 has deprecated a few of the older ways of showing media as well as offering up a new way to create games and animations. Audio, video, and canvas are just a few of the adjustments made between XHTML and HTML5. As we learned in our last micr…
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …

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