//css
.file_input_textbox
{
float: left
}
.file_input_div
{
position: relative;
width: 100px;
height: 23px;
overflow: hidden;
}
.file_input_button
{
width: 100px;
position: absolute;
top: 0px;
background-color: #33BB00;
color: #FFFFFF;
border-style: solid;
}
.file_input_hidden
{
font-size: 45px;
position: absolute;
right: 0px;
top: 0px;
opacity: 0;
filter: alpha(opacity=0);
-ms-filter: "alpha(opacity=0)";
-khtml-opacity: 0;
-moz-opacity: 0;
}
//html
<input type="text" id="fileName" class="file_input_textbox" readonly="readonly">
<div class="file_input_div">
<input type="button" value="Search files" class="file_input_button" />
<input type="file" class="file_input_hidden" onchange="javascript: document.getElementById('fileName').value = this.value" />
</div>
Showing posts with label Change background color of input type file browse button. Show all posts
Showing posts with label Change background color of input type file browse button. Show all posts
Wednesday, September 26, 2012
Change background color of input type file browse button
Subscribe to:
Posts (Atom)
Popular Posts
-
Variables are important in every programming language — and it’s no different in PHP. Variables give developers the possibility of temp...
-
What? Hide the .php extension of your PHP files in the URL of your site address. Instead of: http://www.example.com/page.php Visitors to ...
-
Questions : 1 Who is the father of PHP ? Answers : 1 Rasmus Lerdorf is known as the father of PHP. Questions : 2 What is the...
-
Change Db settings here C:\xampp\htdocs\modx\core\xpdo\xpdo.class Line 2920 $this->config['dsn']= $dsn; $this->con...
-
<form action="" name="" method="post"> <p><b>user:</b> <input type="text...
-
Redirection is process of forwarding one URL to a different URL. There are three main kinds of redirects online; 301, 302 and meta refres...
-
Questions : 1 What is database or database management systems (DBMS)? and - What’s the difference between file and database? Can files...
-
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script...
-
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Add More Elements...