Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]

Groups > comp.lang.javascript > #22739 > unrolled thread

How to transform a image into clickable button?

Back to article view | Back to comp.lang.javascript

Contents

  How to transform a image into clickable button? vla.figueiredo@gmail.com - 2014-01-21 13:14 -0800
    Re: How to transform a image into clickable button? "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2014-01-21 22:57 +0100
    Re: How to transform a image into clickable button? Denis McMahon <denismfmcmahon@gmail.com> - 2014-01-21 22:30 +0000
    Re: How to transform a image into clickable button? Joao Rodrigues <groups_jr-1@yahoo.com.br> - 2014-01-23 10:33 -0200
      Re: How to transform a image into clickable button? "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2014-01-23 16:01 +0100
        Re: How to transform a image into clickable button? "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2014-01-23 16:13 +0100
          Re: How to transform a image into clickable button? "Jukka K. Korpela" <jkorpela@cs.tut.fi> - 2014-01-23 17:57 +0200
            Re: How to transform a image into clickable button? "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2014-01-23 17:08 +0100
              Re: How to transform a image into clickable button? "Jukka K. Korpela" <jkorpela@cs.tut.fi> - 2014-01-23 18:37 +0200
                Re: How to transform a image into clickable button? "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2014-01-23 20:13 +0100
                  Re: How to transform a image into clickable button? "Jukka K. Korpela" <jkorpela@cs.tut.fi> - 2014-01-23 21:23 +0200

#22739 — How to transform a image into clickable button?

[ I'm really a noob on coding ]

I'm creating a e-mail mkt with 2 buttons on it.

I've already placed an image and linked with the right source from my server.
Now I want to transform this image into a clickable button.

How?

tnx

[toc] | [next] | [standalone]

#22742

vla.figueiredo@gmail.com wrote on 21 jan 2014 in comp.lang.javascript:

> [ I'm really a noob on coding ]
> 
> I'm creating a e-mail mkt with 2 buttons on it.
> 
> I've already placed an image and linked with the right source from my
> server. Now I want to transform this image into a clickable button.

This is not a NG where you can order code for free.

Show us how far you have come with your code and where you get stuck.
Don't include code that has nothing to do with your problem.

Or go to a helpdesk or rent a professional.

-- 
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

[toc] | [prev] | [next] | [standalone]

#22745

On Tue, 21 Jan 2014 13:14:58 -0800, vla.figueiredo wrote:

> Now I want to transform this image into a clickable button. How?

Using appropriate markup for the (x)html version specified in the doctype 
of your webpage.

-- 
Denis McMahon, denismfmcmahon@gmail.com

[toc] | [prev] | [next] | [standalone]

#22756

Em 21/01/2014 19:14, vla.figueiredo@gmail.com escreveu:
> [ I'm really a noob on coding ]
>
> I'm creating a e-mail mkt with 2 buttons on it.
>
> I've already placed an image and linked with the right source from my
> server. Now I want to transform this image into a clickable button.
>
> How?
>
> tnx
>

You don't need a client-side JavaScript code to accomplish what you want 
to do. E.g. (submitting a form):

<button name="btnSubmit" type="submit">
<img alt="" src="/img/select.gif" />
Submit</button>

However, you can use the button's onclick attribute to execute a JS 
function for instance. In this case, you might use type="button" instead 
of type="submit". E.g.

<button name="btn1" type="button" onclick="alert('hi')">
<img alt="" src="/img/image1.gif" />
Action 1</button>

<button name="btn2" type="button" onclick="alert('hey')">
<img alt="" src="/img/image2.gif" />
Action 1</button>


See:
<http://www.w3.org/TR/html401/interact/forms.html#edef-BUTTON>
<http://www.w3.org/TR/html401/interact/scripts.html>

-- 
Joao Rodrigues (J.R.)

[toc] | [prev] | [next] | [standalone]

#22757

Joao Rodrigues <groups_jr-1@yahoo.com.br> wrote on 23 jan 2014 in 
comp.lang.javascript:

> Em 21/01/2014 19:14, vla.figueiredo@gmail.com escreveu:
>> [ I'm really a noob on coding ]
>>
>> I'm creating a e-mail mkt with 2 buttons on it.
>>
>> I've already placed an image and linked with the right source from my
>> server. Now I want to transform this image into a clickable button.
>>
>> How?
>>
>> tnx
>>
> 
> You don't need a client-side JavaScript code to accomplish what you want 
> to do. E.g. (submitting a form):
> 
> <button name="btnSubmit" type="submit">
> <img alt="" src="/img/select.gif" />
> Submit</button>
> 
> However, you can use the button's onclick attribute to execute a JS 
> function for instance. In this case, you might use type="button" instead 
> of type="submit". E.g.
> 
> <button name="btn1" type="button" onclick="alert('hi')">
> <img alt="" src="/img/image1.gif" />
> Action 1</button>

Far more simple [keep in outside a form or add ";return false;"]:

<input type='image' src='my.jpg' onclick="alert('hi')">

> <button name="btn2" type="button" onclick="alert('hey')">
> <img alt="" src="/img/image2.gif" />
> Action 1</button>
> 
> 
> See:
> <http://www.w3.org/TR/html401/interact/forms.html#edef-BUTTON>
> <http://www.w3.org/TR/html401/interact/scripts.html>
> 



-- 
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

[toc] | [prev] | [next] | [standalone]

#22758

"Evertjan." <exxjxw.hannivoort@inter.nl.net> wrote on 23 jan 2014 in 
comp.lang.javascript:

>> <button name="btn1" type="button" onclick="alert('hi')">
>> <img alt="" src="/img/image1.gif" />
>> Action 1</button>
> 
> Far more simple [keep in outside a form or add ";return false;"]:
> 
> <input type='image' src='my.jpg' onclick="alert('hi')">

Silly me, try:

<img src='my.jpg' onclick="alert('hi');">




-- 
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

[toc] | [prev] | [next] | [standalone]

#22759

2014-01-23 17:13, Evertjan. wrote:

> Silly me, try:
>
> <img src='my.jpg' onclick="alert('hi');">

So now you have made it work if JavaScript is enabled and if the image 
is displayed. A previous suggestion of yours might have worked even if 
JavaScript is disabled.

We don't really know what the OP wants, still less what (s)he needs. I 
wonder what "email mkt" is, what the existing buttons are, and in which 
sense the image should be transformed to a button and in which sense it 
should become clickable.

-- 
Yucca, http://www.cs.tut.fi/~jkorpela/

[toc] | [prev] | [next] | [standalone]

#22760

"Jukka K. Korpela" <jkorpela@cs.tut.fi> wrote on 23 jan 2014 in 
comp.lang.javascript:

> 2014-01-23 17:13, Evertjan. wrote:
> 
>> Silly me, try:
>>
>> <img src='my.jpg' onclick="alert('hi');">
> 
> So now you have made it work if JavaScript is enabled and if the image 
> is displayed. A previous suggestion of yours might have worked even if 
> JavaScript is disabled.

Wrong.

 onclick="alert('hi');" 

always needs Javascript to work.

> We don't really know what the OP wants, still less what (s)he needs. I 
> wonder what "email mkt" is, what the existing buttons are, and in which 
> sense the image should be transformed to a button and in which sense it 
> should become clickable.

As this NG is not a helpdesk, I am not interested so much as you seem to do 
in what the OP wants, I take what the OP writes on face value, and like to 
discuss the matter and its derivatives with the group.

If that helps the OP that is just another bonus, but not the final goal.


-- 
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

[toc] | [prev] | [next] | [standalone]

#22762

2014-01-23 18:08, Evertjan. wrote:

>> So now you have made it work if JavaScript is enabled and if the image
>> is displayed. A previous suggestion of yours might have worked even if
>> JavaScript is disabled.
>
> Wrong.
>
>   onclick="alert('hi');"
>
> always needs Javascript to work.

A previous suggestion of yours has <input type='image' ...> and it may 
work even if JavaScript is disabled (namely when it is inside a form or, 
more generally, has a form owner).

> As this NG is not a helpdesk, I am not interested so much as you seem to do
> in what the OP wants, I take what the OP writes on face value, and like to
> discuss the matter and its derivatives with the group.

It seems that you are just throwing some random snippets of code, some 
of which aren't even valid markup.

If you know what the face value is (that is, which specific problem you 
are trying to address), then you should say it.

-- 
Yucca, http://www.cs.tut.fi/~jkorpela/

[toc] | [prev] | [next] | [standalone]

#22763

"Jukka K. Korpela" <jkorpela@cs.tut.fi> wrote on 23 jan 2014 in
comp.lang.javascript: 

> 2014-01-23 18:08, Evertjan. wrote:
> 
>>> So now you have made it work if JavaScript is enabled and if the image
>>> is displayed. A previous suggestion of yours might have worked even if
>>> JavaScript is disabled.
>>
>> Wrong.
>>
>>   onclick="alert('hi');"
>>
>> always needs Javascript to work.
> 
> A previous suggestion of yours has <input type='image' ...> and it may 
> work even if JavaScript is disabled (namely when it is inside a form or,
> more generally, has a form owner).

Silly you, Jukka, I excluded the form possibility explicitly, which you 
conveniently skipped to make nasty remarks, it seems.

The code giving an system alert "hi" realy needs javascript in most 
browsers, so it won't work with javascript disabled.

>> As this NG is not a helpdesk, I am not interested so much as you seem
>> to do in what the OP wants, I take what the OP writes on face value,
>> and like to discuss the matter and its derivatives with the group.
> 
> It seems that you are just throwing some random snippets of code, some 
> of which aren't even valid markup.
> 
> If you know what the face value is (that is, which specific problem you 
> are trying to address), then you should say it.

No, you are being illigical by saying what I should or not should do.

I bring my ideas and I expect you to give arguments to the contrary.
But just giving ad hominem remarks does not much good in a discussion.

If you find invalid markup, show it, and don't expect people to believe you 
on face value.

btw, beng valid markup doesn't say anything to the quality of code, and is 
not at all necessary to address a point of view.


-- 
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

[toc] | [prev] | [next] | [standalone]

#22764

2014-01-23 21:13, Evertjan. wrote:

> No, you are being illigical

Thank your for that eloquent remark. I rest my case.

-- 
Yucca, http://www.cs.tut.fi/~jkorpela/

[toc] | [prev] | [standalone]

Back to top | Article view | comp.lang.javascript

csiph-web