Date : March 29 2020, 07:55 AM
will be helpful for those in need Never mind, I found the cause. It turns out I was styling TextView somewhere in my theme with <item name="android:gravity">center_horizontal</item>
|
Tag : html , By : Jason Vance
Date : March 29 2020, 07:55 AM
I wish did fix the issue. Using the :last-child pseudoclass, you can pull this off with the addition of one more rule. #nav > ul > li:last-child > ul > li > ul {
left: auto;
right: 100%;
}
|
Date : March 29 2020, 07:55 AM
I hope this helps you . It's a little bit of a dirty hack but it gets the job done. jQuery Code: jQuery('ul.nav li.dropdown').hover(function (){
jQuery(this).find('.dropdown-menu').stop(true, true).delay(200).fadeIn();
jQuery('a').hover(function() {
var height = jQuery(this).offset();
jQuery(this).parent().find('.sub-menu').css('top', height.top - +106);
});
}, function (){
jQuery(this).find('.dropdown-menu').stop(true, true).delay(200).fadeOut();
});
jQuery('.btn-navbar').on('click',function(){
jQuery('nav#main_menu > .nav-collapse > ul.nav-pills').slideDown();
});
|
Date : March 29 2020, 07:55 AM
it fixes the issue just modify the script as below, and add css transition effect if you want the marker to move smoothly. I created a working example HERE with your code and some random css $("#services ul > li").click(function(event){
var position = $(this).position().left;
var width = Math.round($(this).width()/2) - 5;
var arrowPos = position + width;
$('#marker').css('left', arrowPos);
event.preventDefault();
});
|
Date : March 29 2020, 07:55 AM
will be helpful for those in need If you want to add pseudo element on hover first you need to target :hover and then add pseudo element. Your selector will be .mainmenu_item:hover:after .mainmenu{
display: inline-block;
list-style-type: none;
padding-top: 25px;
padding-left: 0px;
font-size:0;
}
.mainmenu_item{
font-size: 14px;
display: inline-block;
padding:8px;
position: relative;
line-height:2em;
background: #000;
color: #FFF;
}
.mainmenu_item a {
text-decoration: none;
color: currentColor;
}
.mainmenu_item:hover:after {
content:'';
width: 0;
height: 0;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-bottom: 5px solid currentColor;
position: absolute;
bottom:0;
left:50%;
margin-left: -5px;
}
.mainmenu_link{
font-family:FrutigerCELight,Arial,Helvetica,sans-serif;
text-decoration: none;
font-size:14px;
}
<ul class="mainmenu">
<li class="mainmenu_item"><a class="mainmenu_link" href="#" title="Home">Home</a>
</li>
<li class="mainmenu_item"><a class="mainmenu_link" href="#" title="About Us">About Us</a>
</li>
<li class="mainmenu_item"><a class="mainmenu_link" href="#" title="Services">Services</a>
</li>
<li class="mainmenu_item"><a class="mainmenu_link" href="#" title="Portfolio">Portfolio</a>
</li>
<li class="mainmenu_item"><a class="mainmenu_link" href="#" title="Blog">Blog</a>
</li>
<li class="mainmenu_item"><a class="mainmenu_link" href="#" title="Contact">Contact</a>
</li>
</ul>
|