html - Full hover animation duration with quick mouseover/mouseout? -


i have hovering effect on image. if mouseover , stay there mouse, transition execute given duration.

i have done correct transition when leave spot.

now, want hover transition starts given duration, no matter if hovered on image quick 1millisecond.

is possible javascript?

.example { position: absolute;              left: 0;              height:320px;              bottom: 0;              width: 100%;              background: #000;              background-color: rgba(255, 255, 255, 0.4);              opacity:0;              -webkit-transition: background-color 2s ease-out;              -moz-transition: background-color 2s ease-out;              -o-transition: background-color 2s ease-out;              -ms-transition: background-color 2s ease-out;               transition: opacity 0.5s ease-in-out;              -moz-transition: opacity 0.5s ease-in-out;              -webkit-transition: opacity 0.5s ease-in-out;              -o-transition: opacity 0.5s ease-in-out;             -ms-transition: opacity 0.5s ease-in-out;              transition: opacity 0.5s ease-in-out;              text-align: center;              line-height: 299px;              text-decoration: none;              color: #000000;              font-size:30pt;           }     .image:hover .example { background-color: rgba(255, 255, 255, 0.4);                          -webkit-transition: background-color 0.5s  ease-in-out;                          -moz-transition: background-color 0.5s  ease-in-out;                          -o-transition: background-color 0.5s  ease-in-out;                          -ms-transition: background-color 0.5s ease-in-out;                          transition: background-color 0.5s ease-in-out;                          -webkit-transition: opacity 0.5s  ease-in-out;                          -moz-transition: opacity 0.5s  ease-in-out;                          -o-transition: opacity 0.5s  ease-in-out;                          -ms-transition: opacity 0.5s  ease-in-out;                          transition: opacity 0.5s ease-in-out;                          opacity:1;                        }

with this, if hover on image, text , background colors animating in , when leave image text , background color animating out. works okay. (even though, above code bit unsorted now)

so, want fading in , out animation executed if hover fast on image , back.

i think not possible it? (with css mean)

i afraid, have use bit of javascript because far know, not possible without javascript.

add class on hover, , remove on animation end. refer answer know how - css3 animation on :hover; force entire animation

ps: have put comment, don't have privileges right now.


Comments

Post a Comment

Popular posts from this blog

android - Pass an Serializable object in AIDL -

i have defined aidl file interface imyfeature { void dotask(class clazz); } but need pass class object process. possible in android? if so, how? i tried: interface imyfeature { serializable class; void dotask(class clazz); } but doesn’t work. aidl in android supports custom class implement parcelable interface. in case want send class object not possible. can send class canonical name , retrieve in service. for example have aidl file interface imyfeature { void dotask(string classname); } then call : binder.dotask(myclass.class.getcanonicalname()); and in service binder stub implementation : private final imyfeature mbinder = new imyfeature.stub() { public void dotask(string classname) { try { class<?> clazz = class.forname(classname); constructor<?> ctor = clazz.getconstructor((class[]) null); object object = ctor.newinstance(); ...
Read more

How to provide Authorization & Authentication using Asp.net, C#? -

Image
i have asp.net application in c#. i have provide page authorization specific user/usergroup. i have created 2 tables in database: 1) pagename 2)permissions[insert, update, view, delete] but i'm unable match tables , permissions assigning... can 1 please me, how created tables in database , how coding. please me. you can below explanation. configure access specific file , folder, set forms-based authentication. request page in application redirected logon.aspx automatically. in web.config file, type or paste following code. this code grants users access default1.aspx page , subdir1 folder . <configuration> <system.web> <authentication mode="forms" > <forms loginurl="login.aspx" name=".aspnetauth" protection="none" path="/" timeout="20" > </forms> </authentication> <!-- section denies access files in...
Read more

How to use Authorization & Authentication in Asp.net, C#? -

i using roll management , trying give page , folder access according user or user group, using server created ad group user authentication. i have default1.aspx page default , subdir1 folder give different access separate user group i using below logic in web.config. <location path="subdir1"> <system.web> <authorization> <allow users ="?" /> </authorization> </system.web> </location> i facing problem provide same access 2 or more directory same user should have provide allow user code twice both folder? i can use logic repeating value folder want access providing in 1 logic. i have got answer configure folder/page access, have make different access shown below.. configure access specific file , folder, set forms-based authentication. request page in application redirected logon.aspx automatically. in web.config file, done following code. this code grants user...
Read more