making an input box image clickable

[pallavi1811]

hi.. this is my html:

this is my css:

#name{
background-color: #FFFFFF;
background-image: url(“file:///Users/pallavi/Documents/workspace/PalCas/WebContent/images/forward_arrow.png”);
background-position: 95% center;
background-repeat: no-repeat;
border: 1px solid grey;
border-radius: 5px 5px 5px 5px;
height: 30px;
margin-left: 480px;
margin-top: -180px;
padding-left: 10px;
width: 250px;
}

i want to click img

background-image: url(“file:///Users/pallavi/Documents/workspace/PalCas/WebContent/images/forward_arrow.png”);

and open a new html.

how would i do that???

Please reply asap.

[Kitty Giraudel]

I don’t understand, really.

[Paulie_D]

You can’t click a background image.

**Do you have a link?**

If you want to go to a different page you have to use an anchor link and I’m guessing you don’t have one.

https://css-tricks.com/how-to-ask-a-good-question-in-the-forums/

[pallavi1811]

this is an input box which has an arrow image. i want click arrow image.

Is there any other way to do it.. any change in html or css can be done?

[Paulie_D]

**WE NEED A LINK or A CODEPEN.**

Frankly, I’m not sure what you are trying to do.

What kind of input..there are several?

[PicnicTutorials]

Wrap the input in an anchor.

[Paulie_D]

@websitecodetutorials

I’m assuming that he wants the new page to be related to the contents of the input…so that probably won’t work.

I’m feeling a jQ solution coming on. :)

[Paulie_D]

I’m guessing this is related: https://css-tricks.com/forums/discussion/22872/need-an-input-type-textbox-with-image-and-rounded-corners

[pallavi1811]

yes right..the same discussion..

if i wrap my input tag with an ‘a’ tag will it work?

[Paulie_D]

Nope.

You haven’t specified what it is you are trying to do.

What relation does the contents of the input have to the link?

[pallavi1811]

see i have this textbox..

inside this textbox i wanna write something and hit the image and it will go to next html.. hw can i achieve this?

[Paulie_D]

Please specify what you mean by ‘next html’

Do you mean a set page that won’t change?

[pallavi1811]

yes.. a static html.. like i can do:

but in this case it is set as my background image for the textbox.. so hw to do for this particular case..

[pallavi1811]

sorry code dint come:
yes.. a static html.. like i can do:

[Paulie_D]

OK….as I said, you can’t click a background image but you can have a link with a background image.

You have to have an anchor link in your HTML (ideally) and position it after the text area: http://codepen.io/Paulie-D/pen/yELfD

We may not be able to style it as you were hoping but this will give you an idea.

[Author]

Posts