html - Make underline CSS transition change direction -


i using style found on this website create underline slide in effect. please see jsfiddle example.
can see, underline comes in left right. how go making line on top of text, transitions in right left? adapt current code snippet, or have use different method entirely?

.cmn-t-underline {    position: relative;    color: #ff3296;  }  .cmn-t-underline:after {    display: block;    position: absolute;    left: 0;    bottom: -10px;    width: 0;    height: 10px;    background-color: #2e9afe;    content: "";    -webkit-transition: 0.3s;    -moz-transition: 0.3s;    -o-transition: 0.3s;    transition: 0.3s;    height:2px;  }  .cmn-t-underline:hover {    color: #98004a;  }  .cmn-t-underline:hover:after {    width: 100%;  	height:2px;  }
<h1 class="cmn-t-underline">test</h1>

http://jsfiddle.net/juhl2256/1/

change left right.

.cmn-t-underline:after {   display: block;   position: absolute;   right: 0;   bottom: -10px;   width: 0;   height: 10px;   background-color: #2e9afe;   content: "";   -webkit-transition: 0.3s;   -moz-transition: 0.3s;   -o-transition: 0.3s;   transition: 0.3s;   height:2px; }

Comments

Post a Comment

Popular posts from this blog

java - BeanIO write annotated class to fixedlength -

i trying write annotated class fixedlength file beanio. classes annotated getting exception "invalid field 'employees', in record 'team', in stream 'tm': type handler not found type 'com.mycompany.bio.employee'" below source code public static void main(string[] args) { streamfactory factory = streamfactory.newinstance(); streambuilder builder = new streambuilder("tm") .format("fixedlength") .parser(new fixedlengthparserbuilder()) .addrecord(com.mycompany.bio.team.class); factory.define(builder); employee e1 = new employee("empf1", "empl1", "developer", "1", new date()); employee e2 = new employee("empf2", "empl2", "developer", "2", new date()); team team = new team(); team.setteamname("great team"); team.getemployees().add(e1); team.getemployees().a...
Read more

Using Java 8 lambdas/transformations to combine and flatten two Maps -

i have 2 maps: map<a, collection<b>> mapab map<b, collection<c>> mapbc i transform them map<a, collection<c>> mapac , i'm wondering if there's smooth way lambdas , transformations. in particular case, collections sets, i'd solve problem collections in general. one thought had first combine 2 maps map<a, map<b, collection<c>>> , flatten it, i'm open approach. data notes: b should occur in value collection associated 1 a , , same true mapbc (a given c mapped 1 b ). result, there should 1 path given a given c , although there may a -> b mappings there no b -> c mappings , there may b -> c mappings there no corresponding a -> b mappings. these orphans don't appear in resulting mapac . for sake of comparison, here's example of purely imperative approach same problem: map<a, collection<c>> mapac = new hashmap<>(); (entry<a, collection<b>> entry...
Read more

How to connect android app to App engine -

i'm trying connect app in android server i've opened on appengine. my server's name : dddd-daniel-2345 , website server : http://dddd-daniel-2345.appspot.com/ this how connect android app server in app engine: app.yaml: application: dddd-daniel-2345 version: 1 runtime: python27 api_version: 1 threadsafe: yes handlers: - url: .* script: main.app libraries: - name: webapp2 version: "2.5.2" main.py: #!/usr/bin/env python # # copyright 2007 google inc. google.appengine.api import users import webapp2 class userhandler(webapp2.requesthandler): def get(self): user = users.get_current_user() if user: greeting = ('%s,%s,%s' % (user.email(),user.user_id(),user.nickname())) else: greeting = ('not logged in') self.response.out.write(greeting) app = webapp2.wsgiapplication([('/', userhandler),], debug=true) my applications code : add manifast main....
Read more