Jump to content
JohnB

This feature

By JohnB, in DMS & Legacy Products

Recommended Posts

JohnB    0

JohnB
Posted

Hi All,

This theme has five Recent posts that move slightly to the right when hovered over. Is there a general bit of easy to activate js or plugin that can do this.

http://adammunns.com/modern/

Cheers

John

Share this post

Link to post
Share on other sites

James B    436

James B
Posted

Hi there. I've taken a look in firebug for you, the effect is actually be done by Css using a moz transition to ease the state between the standard status of the link and the hover status, which has a left-padding applied to it. I've copied the code I can see below for you. Here's a link to more on transitions http://www.w3schools.com/css3/css3_transitions.asp

Easing status applied to the standard button


#morefoot .widget-pad ul li a {

    -moz-transition: all 0.5s ease 0s; }
Code for the hover status with the padding 

#morefoot .widget-pad ul li a {padding-left:10px;}

Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Go To Topic Listing DMS & Legacy Products

  • Similar Content

    • Perry
      [Solved] CSS not loading outside of editor
      By Perry+
      Hello there,
      We have started experiencing a crippling issue within the last few days. It seems that ever since three days ago the CSS will not load for our pages outside of the DMS editor. Inside of the editor everything appears to be looking fine, but after publishing and viewing the page in a new browser our elements are all over the place, and in the console it appears that there is an error stating that the CSS did not get loaded. Looking through FTP, it seems that the two CSS files in the pagelines folder in wp-content are now missing. We did not access this folder or modify any files prior to this.  What kind of problem could this be? We are totally halted on any work we can perform until this is solved, so any help would be greatly appreciated. 
      An example of the phenomenon: http://datesafe2.21thirteenhost.com/category/ask-mike/
      Best,
      Perry
    • Queue-it
      Autoptimize, combining JS files crash the functionality
      By Queue-it+
      Hi,
      We are using Autoptimize plugin to combine JS and CSS files to improve the site performance, but the there are couple of JS files from Pagelines that crash when included in the plugin.  (superfish.js, pl.tangram.js, meganav.js)
      Can you recommend a way to include these JS files that won't crash the pages where they are present?
       
      Thanks.
    • dymond
      How to Delete Java Script from hmtl section in PL5
      By dymond+
      Ahhh I screwed up. I was ALMOST DONE with my website, and tried adding a mailchimp js pop up form on the home page with this code mailchimp gave me for the pop up:
      <script type="text/javascript" src="//s3.amazonaws.com/downloads.mailchimp.com/js/signup-forms/popup/embed.js" data-dojo-config="usePlainJson: true, isDebug: false"></script><script type="text/javascript">require(["mojo/signup-forms/Loader"], function(L) { L.start({"baseUrl":"mc.us12.list-manage.com","uuid":"d136d5c71f4509140650ecf70","lid":"ab22ff149a"}) })</script>
       
      However, instead of adding a pop up it applied to the entire home page so now when I go to page to delet the code, I can;t... I get the stupid pop up and all i see is ablank page... please can someone out there help? Thank you! i have no idea where to manually find the code so I can delete it. I added a PL5 section "html" and dropped it in there...
      www.purplerosedesigncenters.com
       
       

    • MobileParity
      Site Not Loading
      By MobileParity+
      www.bingerr.com
      DMS 2+
      WooCommerce 2+
      debug:enabled
       
      ### Active Plugins (26) ###   BAW Post Views Count: by Juliobox – 2.19.11 BigTextDMS PL Section: by TourKick – 1.1 Dms Developer Tools: by PageLines – 0.2 DMS Professional Tools: by PageLines – 1.8.5 Dokan Lite - Multi-vendor Marketplace: by Tareq Hasan – 1.0 Footer Extras DMS: by Ellen Moore – 1.0 Google Captcha (reCAPTCHA) by BestWebSoft: by BestWebSoft – 1.14 Hooker: by Simon Prosser – 1.5.1 MultiMenu: by PageLines – 1.2 Open external links in a new window: by Kristian Risager Larsen – 1.3.1 Orbisius Child Theme Creator: by Svetoslav Marinov (Slavi) – 1.2.5 Poppy: by PageLines – 1.4 PageLines Updater: by PageLines – 1.2.6 GrandStand: by PageLines – 1.3 PLNextBox: by PageLines – 1.1 SideWalk: by PageLines – 1.1 PageLines Signup: by PageLines – 0.2 Responsive Typography: by Kyle & Irving – 1.0.1 Sidebar Manager Light: by OTWthemes.com – 1.8 SolidFooter: by PageLines – 1.0 Stripe for WooCommerce: by Stephen Zuniga – 1.36 SumoMe: by SumoMe – 1.10 WooCommerce Menu Cart: by Jeremiah Prummer Ewout Fernhout – 2.5.6   WooCommerce: by WooThemes – 2.3.7 WordPress Importer: by wordpressdotorg – 0.6.1 WordPress SEO: by Team Yoast – 2.0.1     There appears to be several js errors however I have not made any significant updates to the site in a few days so I am not sure where they are coming from. The site was accessible yesterday however today the dms editor will not load. I am able to access the WP Dashboard however when I try to access the front end of my site for editing (I am using Pagelines DMS 2), I receive a loading error. I have disabled all plugins and removed all custom css and it still will not load. I added back the css and plugins and the problem still persists. Any help is much appreciated.   Cheers,   AG
    • MobileParity
      FitText.js
      By MobileParity+
      I am pretty good with CSS and using DevTools to target the changes that I want however I am terrible when using jQuery. I am trying to use the FitText.js plugin to resize my Masthead Titles when the screen is resized. I have followed a brief tutorial however it seems I am not adding the script to the correct area. I have tried the Custom Code section for header scripts. I have tried adding the code the wp-header via Hooker and still nothing.
      Website URL:www.bingerr.com
      Framework Version:DMS 2
      WordPress Version: 4+
      Plugins in Use: https://github.com/davatron5000/FitText.js
      Server/Host:Flywheel
      Screenshots:
      Details: Code i am using is below:
      <script src="jquery.fittext.js"></script>
      <script> $(document).ready(function() {   //from http://www.pagelinestheme.com/adding-jquery-code-dms-editor/   //CHANGE the jQuery selectors using your Canvas Area's Section ID     //Adding FitText Min/Max font size to Landing Page Masthead   $("#mastheadusrim9x h1.masthead-title").fitText(1, { minFontSize: '50px', maxFontSize: '160px' }); })   (function( $ ){     $.fn.fitText = function( kompressor, options ) {       // Setup options     var compressor = kompressor || 1,         settings = $.extend({           'minFontSize' : Number.NEGATIVE_INFINITY,           'maxFontSize' : Number.POSITIVE_INFINITY         }, options);       return this.each(function(){         // Store the object       var $this = $(this);         // Resizer() resizes items based on the object width divided by the compressor * 10       var resizer = function () {         $this.css('font-size', Math.max(Math.min($this.width() / (compressor*10), parseFloat(settings.maxFontSize)), parseFloat(settings.minFontSize)));       };         // Call once to set.       resizer();         // Call on resize. Opera debounces their resize by default.       $(window).on('resize.fittext orientationchange.fittext', resizer);       });     };   })( jQuery );   </script>
×