Quantcast
Channel: SCN: Message List
Viewing all articles
Browse latest Browse all 8379

Action Sheet - CSS problem / on hover

$
0
0

Hi,

 

1.  I've added the following  CSS on action sheet button :

 

.myButton {
         -moz-box-shadow:inset 0px 1px 0px 0px #97c4fe;
         -webkit-box-shadow:inset 0px 1px 0px 0px #97c4fe;
         box-shadow:inset 0px 1px 0px 0px #97c4fe;
         background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #3d94f6), color-stop(1, #1e62d0));
         background:-moz-linear-gradient(top, #3d94f6 5%, #1e62d0 100%);
         background:-webkit-linear-gradient(top, #3d94f6 5%, #1e62d0 100%);
         background:-o-linear-gradient(top, #3d94f6 5%, #1e62d0 100%);
         background:-ms-linear-gradient(top, #3d94f6 5%, #1e62d0 100%);
         background:linear-gradient(to bottom, #3d94f6 5%, #1e62d0 100%);
         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#3d94f6', endColorstr='#1e62d0',GradientType=0);
         background-color:#3d94f6;
         -moz-border-radius:6px;
         -webkit-border-radius:6px;
         border-radius:6px;
         border:1px solid #337fed;
         display:inline-block;
         cursor:pointer;
         color:#ffffff;
         font-family:Arial;
         font-size:15px;
         font-weight:bold;
         padding:6px 24px;
         text-decoration:none;

         text-shadow:0px 1px 0px #1570cd;

width: 20px;

}
.myButton:hover {
         background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #1e62d0), color-stop(1, #3d94f6));
         background:-moz-linear-gradient(top, #1e62d0 5%, #3d94f6 100%);
         background:-webkit-linear-gradient(top, #1e62d0 5%, #3d94f6 100%);
         background:-o-linear-gradient(top, #1e62d0 5%, #3d94f6 100%);
         background:-ms-linear-gradient(top, #1e62d0 5%, #3d94f6 100%);
         background:linear-gradient(to bottom, #1e62d0 5%, #3d94f6 100%);
         filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#1e62d0', endColorstr='#3d94f6',GradientType=0);
         background-color:#1e62d0;
}
.myButton:active {
         position:relative;
         top:1px;

}



 

The above caused a problem with the press event.

 

The button opens the menu only if i press on the right side of the button.

 

Is it because the i changed the width ==> width: 20px; ?

 

 

 

2. Is there any way to open the menu not on press but on HOVER ?

 

Thanks,

Arie.


Viewing all articles
Browse latest Browse all 8379

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>