1

complete noob to this here, I need your help. I got this:

div#button_search {
    background: url(../_images/button_search.png);
    width: 145px;
    height: 34px;
    float: left;
    opacity: 1;
    transition: opacity .40s ease-in-out;
    -moz-transition: opacity .40s ease-in-out;
    -webkit-transition: opacity .40s ease-in-out;
}

div#button_search:hover {
    background: url(../_images/button_search.png);
    width: 145px;
    height: 34px;
    float: left;
    opacity: 0.8;
    transition: opacity .40s ease-in-out;
    -moz-transition: opacity .40s ease-in-out;
    -webkit-transition: opacity .40s ease-in-out;
}

input{
    position: relative;
    text-align: right;
    -moz-opacity:0 ;
    filter:alpha(opacity: 0);
    opacity: 0;
    z-index: 2;
    width: 529px
}

div#files_innerdrop {
    background: #e5e5e5;
    width: 368px;
    height: 20px;
    float: right;
    margin-top: 4px;
    margin-right: 4px;
    padding-top: 6px;
    padding-left: 5px;
}

Html

<div id="inner_backdrop">
        <div id="files_bar">
            <div id="button_search"><input type="file" id="button_search"/></div>
            <div id="files_innerdrop">

            </div>
        </div>

but it shows this: enter image description here

I want the "choose file" to be the "search for" image, and the text to show in that bar. Any ideas? can you guys lead me to a tut on how to do this?

TrippedStackers
  • 427
  • 1
  • 4
  • 17
  • Think you want this: http://stackoverflow.com/questions/1944267/how-to-change-the-button-text-of-input-type-file – Tyler Day Feb 21 '14 at 02:43

1 Answers1

0

on button use the style css to make it hidden

      Style="display:none;"

on click of an anchor image you can click that button by script

    <a onclick="your script here" ><img src="abc.jpg" /></a>
siddharth gupta
  • 306
  • 1
  • 11