开发者

How to disable login/password highlighting in Opera?

Opera always orange highlights login/password inputs when user confirms "save password" prompt. It doesn't fit my design, is there any CSS way to alter/disable it?

Edit if not by CSS, is 开发者_运维问答there any other solution?


It is not possible to disable this with CSS - it's a browser feature :-)

You also don't get far with trying out different border tweaks: outline affects the area around the highlight, inset box-shadow, background-color, etc. goes below it.


Foolproof JS solution. It just duplicates username and password fields (with changed name=""), hide original ones and set them id=username_original, ... When form_submit is triggered, values from new visible fields are copied to old fields (which are hidden, but have name attribute - Opera wand will handle these).

Additional CSS

.hidden {
    position: absolute;
    width: 0; height: 0;
    overflow: hidden;
    visibility: hidden;
}    

JS

if (document.addEventListener) {
    document.addEventListener("DOMContentLoaded", func, false);
}

function func() {
    // duplicate input[id=username], set to original class=hidden
    var obj = document.getElementById("username"); 
    var newObj = obj.cloneNode(true);
    newObj.name = "";     
    obj.id += "_original";  
    obj.className = "hidden";
    obj.parentNode.insertBefore(newObj,obj);   

    // duplicate input[id=password], set to original class=hidden                                       
    var obj = document.getElementById("password"); 
    var newObj = obj.cloneNode(true);
    newObj.name = "";      
    obj.id += "_original";    
    obj.className = "hidden";
    obj.parentNode.insertBefore(newObj,obj);  


    document.getElementById("submit").onclick = formSubmit;
}        

function formSubmit() {
    if(document.getElementById("username_original").value != "") return; 
    else if(document.getElementById("username_original").value != document.getElementById("username").value) {
        document.getElementById("username_original").value = document.getElementById("username").value;
        document.getElementById("password_original").value = document.getElementById("password").value;
    }
    else return false;
}

HTML form

<form action="" method="post" id="form"><div>   
    <input type="text" id="username" name="username" /><br />
    <input type="password" id="password" name="password" /><br />
    <input type="submit" id="submit" />
</div></form>
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜