xgqfrms™, xgqfrms® : xgqfrms's offical website of GitHub!

js auto hover button & html5 button autofocus

input

// html 5

<input name="myinput" value="whatever" autofocus />

// auto focus


// <input type="text" id="mytext"/>

function setFocusToTextBox(){
    document.getElementById("mytext").focus();
}

https://stackoverflow.com/questions/17500704/javascript-set-focus-to-html-form-element

HTML5 & autofoucs

https://www.w3schools.com/jsref/prop_pushbutton_autofocus.asp
https://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_pushbutton_autofocus

button ??? OK

<button id="myBtn" autofocus>My Button</button>

// <button onclick="myFunction()">Try it</button>

// <p id="demo"></p>


function myFunction() {
  var x = document.getElementById("myBtn").autofocus;
  document.getElementById("demo").innerHTML = x;
}

auto css hover in js

opacity & transparent

.hui-btn-dashed-hover {
    text-decoration: none;
    color: #0072f5;
    background-color: #fff;
    border-color: #0072f5;
    opacity: 0.7;
}
.hui-btn-dashed-hover:hover {
    opacity: 1.0;
}

js set button hover

手动添加，hover 样式，then hover chage transparent

/* .h-btn:not([disabled]):hover {
    text-decoration: none;
}
.h-btn-dashed:hover {
    text-decoration: none;
    color: #0072f5;
    background-color: #fff;
    border-color: #0072f5;
} */
.hui-btn-dashed-hover {
    text-decoration: none;
    color: #0072f5;
    background-color: #fff;
    border-color: #0072f5;
    /*  transparent: */
}

---

---

©xgqfrms 2012-2020

www.cnblogs.com 发布文章使用：只允许注册用户才可以访问！

---