Javascript Question for JS Pros Convert Inline Code to Separate File

by Mohsin Rasool

Posted: 12 years ago 5 replies

PROGRAMMING

Hi Friends,

I have this situation related to JS , will love to get input from JS Experts:

Purpose:
======

Make the AREA MAP link on a Image Map open in Small Window

Solution Inline JS:
======

Code:

<img name="Page1" src="Page1.jpg" width="950" height="1425" border="0" id="Page1" usemap="#m_Page1" alt="" />

<map name="m_Page1" id="m_Page1">
<area shape="poly" coords="695,1008,691,892,371,895,370,962,474,958,480,1005" href="img/p.jpg"  target="_blank" alt="" onclick="window.open(this.href,'','width=800, height=950, top=150, left=250');return false;"  />

</map>

This above inline Javascript code works exactly the way we wanted.
But problem is that we want to have JS in separate file and not inline,
so that every AREA link of IMAGE MAP behaves just like this i.e. Open small window as
is done by this inline code.

As i am do not know much about JS coding, i have tried to google for this solution
but was unable to follow the suggested course as it seems this situation is unique...

Oh yeah one thing i.e. the page with html code with AREA links of Image MAP is not
in our control and we include it using PHP so we cannot directly edit those HTML pages
with AREA MAP links... we need something on site wide which can alter those links
using JS.

Thanks for your time and hope you have some suggestions for me.

Regards,
Mohsin

#code #convert #file #inline #javascript #pros #question #separate

frenchsquared 12 years ago

onclick="myfunction()"

then in an external js file

function myfunction(){
window.open(this.href,'','width=800, height=950, top=150, left=250'
}
- Thanks
{{ DiscussionBoard.errors[5387374].message }}
Mohsin Rasool 12 years ago

Hi,

Thanks for your help.

You are right about this. I have tried this option. But my issue is
that i cannot add onclick="myFunction()" to AREA links of map
as those files are generated and uploaded by users and we want to
add this function to each MAP area link automatically without editing each file's
html links...

Hope you got my point...

Thanks,
Mohsin
- Thanks
Signature
Warriors4Hire: WordPress & GENESIS Experts | Custom WP Theme | WordPress Troubleshooting | Customizations | WP Security | Responsive Themes

My Business site: WarMarks - Web Development | My Personal Blog: Mohsin Rasool
{{ DiscussionBoard.errors[5387413].message }}
Mohsin Rasool 12 years ago
Is it possible with JQuery or some other javascript code...

that we can specify that
every AREA link of Image map has automatically added/apended

onclick="myfunction()"

so that on any given page
every
Code:

<map name="a" id="a"> <area href="afsdfd"> </map>
becomes
Code:

<map name="a" id="a"> <area href="afsdfd" onclick="myFunction()"> </map>
Notice onclick="func()" is added to area link..
is that can be added to all area links by a Javascript code
without having to add onclick="func()" to every <area link ?

Thanks for any suggestions or input.

Regards,
Mohsin
- Thanks
Signature
Warriors4Hire: WordPress & GENESIS Experts | Custom WP Theme | WordPress Troubleshooting | Customizations | WP Security | Responsive Themes

My Business site: WarMarks - Web Development | My Personal Blog: Mohsin Rasool
{{ DiscussionBoard.errors[5387441].message }}
frenchsquared 12 years ago

I did not fully understand that. You can pass variables.

if you can add inline you can add the onclick="myfunction()"
all images can use on function. A function is nothing like a name or id.
There are ment to be used over and over.

so....

function myfunction(){
var thisLink = $(this).attr("href");
alert(thisLink)
}

would alert the href of the image clicked.
Hopefully that explains what you need

or window.open(thisLink)

and you can add other attributes if you need more stuff.
- Thanks
{{ DiscussionBoard.errors[5387467].message }}
Mohsin Rasool 12 years ago

Hmm thanks for your input.

I take your input and try to apply in my situation
and see if i can get it going...

Thanks again for your time and support my friend.
Mohsin
- Thanks
Signature
Warriors4Hire: WordPress & GENESIS Experts | Custom WP Theme | WordPress Troubleshooting | Customizations | WP Security | Responsive Themes

My Business site: WarMarks - Web Development | My Personal Blog: Mohsin Rasool
{{ DiscussionBoard.errors[5388270].message }}

Javascript Question for JS Pros Convert Inline Code to Separate File

Trending Topics

Any thoughts on golf's latest phenom...Scottie Scheffler??

The Twilight Zone

What's the Best IM-Related Skill to Learn Today That Can Help in the Future?

best high quality crypto traffic.

Should i Index Author pages?