Javascript not working for liquid css button

**arc_85** · 10-20-2010, 10:10 AM

I have a web application but need to introduce various themes in it. So i used liquid css buttons so that images used for buttons are less and take minimum time to load.

But later i found that javacript:return functionname() doesnt work in it.
Please find the CSS code to find a solution for the same.

body {
margin: 0;
padding: 10px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 14px;
}
.btn {
float: left;
clear: both;
background: url(images/btn_left.png) no-repeat;
padding: 0 0 0 10px;
margin: 5px 0;
}
.btn a{
float: left;
height: 40px;
background: url(images/btn_stretch.png) repeat-x left top;
line-height: 40px;
padding: 0 10px;
color: #fff;
font-size: 1em;
text-decoration: none;
}
.btn span {
background: url(images/btn_right.png) no-repeat;
float: left;
width: 10px;
height: 40px;
}
.btn_addtocart { background-color: green; }

HTML code:

<div class="btn btn_addtocart"><a href="#>Submit</a><span></span></div>
<div class="clear"></div>
Background Color: Red

The existing application uses
<input type="image" onClick="javascript:return FunctionName()>

I need a alternative javascript to apply the above css code as the above css code doesnt support onClick="javascript:return FunctionName().

Please help!

**vwphillips** · 10-20-2010, 10:59 AM

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
  <title></title>
<style type="text/css">
/*<![CDATA[*/
body {
margin: 0;
padding: 10px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 14px;
}
.btn {
float: left;
clear: both;
background: url(images/btn_left.png) no-repeat;
padding: 0 0 0 10px;
margin: 5px 0;
}
.btn a{
float: left;
height: 40px;
background: url(images/btn_stretch.png) repeat-x left top;
line-height: 40px;
padding: 0 10px;
color: #fff;
font-size: 1em;
text-decoration: none;
}
.btn span {
background: url(images/btn_right.png) no-repeat;
float: left;
width: 10px;
height: 40px;
}
.btn_addtocart { background-color: green; }


/*]]>*/
</style>
<script type="text/javascript">
/*<![CDATA[*/

function FunctionName(){
 alert('submit');
 return false;
}
/*]]>*/
</script>
</head>

<body>
<form onsubmit="return FunctionName()">
<div class="btn btn_addtocart"><a href="#">Submit</a><span></span></div>
<div class="clear"></div>
Background Color: Red

The existing application uses
<input type="image" src="http://www.vicsjavascripts.org.uk/StdImages/One.gif">
</form>

</body>

</html>

Thread: Javascript not working for liquid css button

Thread Tools

Search Thread

Javascript not working for liquid css button

Bookmarks

Bookmarks

Posting Permissions