button i zmiana tla po najechaniu

Thread View: pl.comp.lang.javascript

8 messages

[T] Back to Threads [V] Tree View [G] Group Articles

8 total messages Started by zlotowinfo Sun, 14 Mar 2010 20:18

#49878

Author: zlotowinfo
Date: Sun, 14 Mar 2010 20:18

2 lines
895 bytes

jak do elementu <button dorobić zmianę tła
z tlo.png na tlo2.png

Re: button i zmiana tla po najechaniu

#49879

Author: fuzjusz
Date: Sun, 14 Mar 2010 23:34

26 lines
1732 bytes

może to Cię zadowoli:

<html>
	<head>
		<style type="text/css">

input[type="button"]{
	background-image:url('p1.png');
}

input[type="button"]:hover{
	background-image:url('p2.png');
}

input[type="button"]:active{
	background-image:url('p3.png');
}

		</style>
	</head>
	<body>
		<input type="button" value="bez"/>
		<input type="button" value="java"/>
		<input type="button" value="script"/>
	</body>
</html>

Re: button i zmiana tla po najechaniu

#49880

Author: zlotowinfo
Date: Wed, 17 Mar 2010 23:49

19 lines
1495 bytes

Użytkownik "fuzjusz" <buckokamil@gmail.com> napisał w wiadomości 
news:f255227b-4a18-422f-b64c-18176abfc79c@k17g2000yqb.googlegroups.com...

tylko to button
<button> </button>
a nie
<input type=button>



na razie znalazłem coś takiego:

function change2(image){
if (event.srcElement.tagName=="BUTTON")
event.srcElement.style.backgroundImage="url"+"('"+image+".png')"
}

<button onMouseover="change2(\'3\')" onMouseout="change2(\'\')"></button>

Re: button i zmiana tla po najechaniu

#49881

Author: fuzjusz
Date: Fri, 19 Mar 2010 16:43

26 lines
1700 bytes

> <button> </button>

<html>
	<head>
		<style type="text/css">

button{
	background-image:url('p1.png');
}

button:hover{
	background-image:url('p2.png');
}

button:active{
	background-image:url('p3.png');
}

		</style>
	</head>
	<body>
		<button>bez</button>
		<button>java</button>
		<button>script</button>
	</body>
</html>

Re: button i zmiana tla po najechaniu

#49882

Author: zlotowinfo
Date: Sat, 20 Mar 2010 08:14

15 lines
1519 bytes

Uzytkownik "fuzjusz" <buckokamil@gmail.com> napisal w wiadomosci 
news:59c89d16-771c-4114-9fab-d05633cd7360@q21g2000yqm.googlegroups.com...
> <style type="text/css">
>
> button{
> background-image:url('p1.png');
> }
>
> button:hover{
> background-image:url('p2.png');
> }
>
[...]
wyjdzie krócej to fakt
pytanko jeszcze czy ten obrazek da sie jakos rozciagna na calosc przycisku?

Re: button i zmiana tla po najechaniu

#49883

Author: zlotowinfo
Date: Sat, 20 Mar 2010 08:21

14 lines
1452 bytes

Uzytkownik "fuzjusz" <buckokamil@gmail.com> napisal w wiadomosci 
news:59c89d16-771c-4114-9fab-d05633cd7360@q21g2000yqm.googlegroups.com...
>> <button> </button>
>
> <html>
> <head>
> <style type="text/css">
>
> button{
> background-image:url('p1.png');
> }
>
[...]
niestety w internet explorer ten kod nie dziala

Re: button i zmiana tla po najechaniu

#49884

Author: Paweł Piskorz
Date: Sat, 20 Mar 2010 12:44

23 lines
1622 bytes

On 2010-03-20 09:21, zlotowinfo wrote:
> Uzytkownik "fuzjusz" <buckokamil@gmail.com> napisal w wiadomosci
> news:59c89d16-771c-4114-9fab-d05633cd7360@q21g2000yqm.googlegroups.com...
>>> <button> </button>
>>
>> <html>
>> <head>
>> <style type="text/css">
>>
>> button{
>> background-image:url('p1.png');
>> }
>>
> [...]
> niestety w internet explorer ten kod nie dziala

Chyba w 6, ale kogo to obchodzi :)


-- 
message[autor="PablO"]::after {
	content:"Pozdrawiam";
}

Re: button i zmiana tla po najechaniu

#49885

Author: zlotowinfo
Date: Sat, 20 Mar 2010 17:23

22 lines
1801 bytes

Użytkownik "Paweł Piskorz" <nie.ma.maila@psikre.nie?> napisał w wiadomości 
news:ho2fv7$gg4$1@inews.gazeta.pl...
> On 2010-03-20 09:21, zlotowinfo wrote:
>> Uzytkownik "fuzjusz" <buckokamil@gmail.com> napisal w wiadomosci
>> news:59c89d16-771c-4114-9fab-d05633cd7360@q21g2000yqm.googlegroups.com...
>>>> <button> </button>
>>>
>>> <html>
>>> <head>
>>> <style type="text/css">
>>>
>>> button{
>>> background-image:url('p1.png');
>>> }
>>>
>> [...]
>> niestety w internet explorer ten kod nie dziala
>
> Chyba w 6, ale kogo to obchodzi :)
>
7, nie używam co prawda, bo wolę opere
ale jednak bez css jest bardziej uniwersalne

Thread Navigation

This is a paginated view of messages in the thread with full content displayed inline.

Messages are displayed in chronological order, with the original post highlighted in green.

Use pagination controls to navigate through all messages in large threads.

Back to All Threads