How to create links to shift
move, nudging Link is an effect that moves or shifts of a few links which
result from the application of the jQuery templates in a website or blog.
Perhaps of us used to call the Link shifted moving or dancing, in addition to the
jQuery effects can also be applied to an image
For fathanah friend who
likes Edit blog might try to move the link Tips on this one and I think it
could make your blog more interesting. For example, my friend can see the link
shifted, this effect using jQuery script which I think is very light when it is
loaded and its application is also quite easy.
How to Put jQuery effects
Links shifted move on Label Blog
Ø Login
prior notice in Blogger
Ø Go
to the Edit HTML template
Ø Check
on the Expand Widget Templates
Ø Find
</ head>
Ø Copy
and paste the script below and place it just above the </ head>
<script
src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js'
type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function() {
$('a.nudge, .#Label1 ul li a').hover(function() { //mouse in
$(this).animate({ marginLeft: '12px' }, 400);
}, function() { //mouse out
$(this).animate({ marginLeft: 0 }, 400);
});
});
</script><!-- end LinkNudging -->
<script type='text/javascript'>
$(document).ready(function() {
$('a.nudge, .#Label1 ul li a').hover(function() { //mouse in
$(this).animate({ marginLeft: '12px' }, 400);
}, function() { //mouse out
$(this).animate({ marginLeft: 0 }, 400);
});
});
</script><!-- end LinkNudging -->
If the color
code Blue is already in your template, the code does not need to be installed
again so my friend just need to put the code underneath it, then the letters in
red above is a widget id on the label, friends Fathonan can customize the label
id on your blog , Below is an example widget id label of my blog template.
<b:widget
id='Label2' locked='false' title='Labels' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
Then to create
links nudging manually on each link either in the post or widget friend
Fathonan can add class="nudge" as below
<a
href="http://fathonan.blogspot.com" class="nudge">Blogger Peer</a>
And to create a
moving image shift nudging my friend can make it like this
<a
href=http://fathonan.blogspot.com" class="nudge"><img
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgP2Ak7mMxvdYUS7EKWxvy6vXFMh5z_2PHQ0lDymCiV9EzxFQ32_LRsiovzgvqeNTrsxv1pExEnh4-Na43tE8KXW0Uocn229L9YQNuhPyjw6ZsuuTVIqgMdfW2WnnBkbgwRJDtoIa7BZ5g/s400/Tips-Trik-Blogger-Tutorial-SEO-Info-BloggerPeer-Blogspot.jpg"/></a>
Sekian Ulasan Info Hari ini Semoga Bermanfaan...
Wassalam mualikum...
0 Comment to "How to Create shift Moves"
Posting Komentar