Support Forum - Tag: mouse-over

Support Forum - Tag: mouse-over - Recent Posts http://www.kriesi.at/support/tags/mouse-over Support Forum - Tag: mouse-over - Recent Posts en-US Wed, 19 Jun 2013 10:29:16 +0000 http://bbpress.org/?v=1.0.2 <![CDATA[Search]]> q http://www.kriesi.at/support/search.php Jasmine Lovelstzy on "Images and Text jumps when moused over" http://www.kriesi.at/support/topic/images-and-text-jumps-when-moused-over#post-112143 Sat, 18 May 2013 13:12:12 +0000 Jasmine Lovelstzy 112143@http://www.kriesi.at/support/ No problem Peter will post a new topic. thx jasmine Dude on "Images and Text jumps when moused over" http://www.kriesi.at/support/topic/images-and-text-jumps-when-moused-over#post-112110 Sat, 18 May 2013 07:04:05 +0000 Dude 112110@http://www.kriesi.at/support/ No, that's another issue imo. You can try it but it seems like the jumping image issue is related to the display attribute (display:inline vs display:block-inline). please do not use this thread for your questions - I don't want to mix things up. jaypopsu on "Images and Text jumps when moused over" http://www.kriesi.at/support/topic/images-and-text-jumps-when-moused-over#post-111977 Fri, 17 May 2013 16:59:43 +0000 jaypopsu 111977@http://www.kriesi.at/support/ Same issue as you Jasmine: <a href="http://www.kriesi.at/support/topic/problem-when-hover-on-image-alignement-with-firefox-and-opera-mac" rel="nofollow">http://www.kriesi.at/support/topic/problem-when-hover-on-image-alignement-with-firefox-and-opera-mac</a> Also wondering if this is the fix. My issue only occurred in FF and not Chrome. Jasmine Lovelstzy on "Images and Text jumps when moused over" http://www.kriesi.at/support/topic/images-and-text-jumps-when-moused-over#post-111959 Fri, 17 May 2013 15:53:53 +0000 Jasmine Lovelstzy 111959@http://www.kriesi.at/support/ I think this is the same/similar problem. - Firefox only: An image uploaded via Advanced Layout Editor goes from right to left after clicked or hoovered: Screenshot: <a href="http://demo.globalads24.com/wp-content/uploads/2013/05/Picture26adj.jpg" rel="nofollow">http://demo.globalads24.com/wp-content/uploads/2013/05/Picture26adj.jpg</a> Live site: <a href="http://babyblueshelp.com" rel="nofollow">http://babyblueshelp.com</a> Can we use the same code or wait for the updated version? thx jasmine Dude on "Images and Text jumps when moused over" http://www.kriesi.at/support/topic/images-and-text-jumps-when-moused-over#post-111953 Fri, 17 May 2013 15:27:19 +0000 Dude 111953@http://www.kriesi.at/support/ Open up the /js/avia.js file in your enfold folder, find lines 245-287 that look like: <pre><code>elements.on('mouseenter', function(e) { var link = $(this), current = link.find('img:first'), url = link.attr('href'), span_class = "overlay-type-video", opa = 0.7; overlay = link.find('.image-overlay'); if(!overlay.length) { if(current.outerHeight() > 100) { if(link.height() == 0) { link.addClass(current.get(0).className); current.get(0).className = ""; } if(!link.css('position') || link.css('position') == 'static') { link.css({position:'relative', overflow:'hidden'}); } if(!link.css('display') || link.css('display') == 'inline') { link.css({display:'inline-block'}); } if( url.match(/(jpg|gif|jpeg|png|tif)/) ) span_class = "overlay-type-image"; if(!url.match(/(jpg|gif|jpeg|png|\.tif|\.mov|\.swf|vimeo\.com|youtube\.com)/) ) span_class = "overlay-type-extern"; overlay = $("").appendTo(link); } } if(current.outerHeight() > 100) { overlay.css({left:current.position().left + parseInt(current.css("margin-left"),10), top:current.position().top + parseInt(current.css("margin-top"),10)}) .css({display:'block','height':current.outerHeight(),'width':current.outerWidth()}).stop().animate({opacity:opa}, 400); } else { overlay.css({display:"none"}); } }).on('mouseleave', elements, function(){ if(overlay.length) { overlay.stop().animate({opacity:0}, 400); } });</code></pre> and replace the entire block above with the block below <pre><code>elements.each(function(e) { var link = $(this), current = link.find('img:first'), url = link.attr('href'), span_class = "overlay-type-video"; overlay = link.find('.image-overlay'); if(!overlay.length) { if(link.height() == 0) { link.addClass(current.get(0).className); current.get(0).className = ""; } if(!link.css('position') || link.css('position') == 'static') { link.css({position:'relative', overflow:'hidden'}); } if(!link.css('display') || link.css('display') == 'inline') { link.css({display:'inline-block'}); } if( url.match(/(jpg|gif|jpeg|png|tif)/) ) span_class = "overlay-type-image"; if(!url.match(/(jpg|gif|jpeg|png|\.tif|\.mov|\.swf|vimeo\.com|youtube\.com)/) ) span_class = "overlay-type-extern"; overlay = $("").appendTo(link); } }); elements.on('mouseenter', function(e) { var link = $(this), current = link.find('img:first'), opa = 0.7; overlay = link.find('.image-overlay'); if(current.outerHeight() > 100) { overlay.css({left:current.position().left + parseInt(current.css("margin-left"),10), top:current.position().top + parseInt(current.css("margin-top"),10)}) .css({display:'block','height':current.outerHeight(),'width':current.outerWidth()}).stop().animate({opacity:opa}, 400); } else { overlay.css({display:"none"}); } }).on('mouseleave', elements, function(){ if(overlay.length) { overlay.stop().animate({opacity:0}, 400); } });</code></pre> I'll ask Kriesi to implement this fix in the next version. graphmaster on "Images and Text jumps when moused over" http://www.kriesi.at/support/topic/images-and-text-jumps-when-moused-over#post-111876 Fri, 17 May 2013 05:31:10 +0000 graphmaster 111876@http://www.kriesi.at/support/ My images jump too. I added them through the Add Media when editing in display mode. I am not using columns, so how do I stop the jumping? It does it in Chrome, IE and Firefox.... Ismael on "Images and Text jumps when moused over" http://www.kriesi.at/support/topic/images-and-text-jumps-when-moused-over#post-111865 Fri, 17 May 2013 05:14:41 +0000 Ismael 111865@http://www.kriesi.at/support/ Hi. Yeah, noticed it. I'm not sure if this will work. Add this on your custom.css <pre><code>post-entry-11 .flex_column.av_one_third .avia_textblock p { margin: 0.85em 0 !important; }</code></pre> <pre><code>.post-entry-11 .flex_column.av_one_third { min-height: 203px !important; }</code></pre> How did you add them anyway? Regards, Ismael johnball on "Images and Text jumps when moused over" http://www.kriesi.at/support/topic/images-and-text-jumps-when-moused-over#post-111727 Thu, 16 May 2013 19:19:01 +0000 johnball 111727@http://www.kriesi.at/support/ Thank you. Images and text still jump though. Do you have a solution for that? <a href="http://dure.ballmedia.com/" rel="nofollow">http://dure.ballmedia.com/</a> Ismael on "Images and Text jumps when moused over" http://www.kriesi.at/support/topic/images-and-text-jumps-when-moused-over#post-111533 Thu, 16 May 2013 01:13:28 +0000 Ismael 111533@http://www.kriesi.at/support/ Hi, Please use this instead. It will render a transparent box and leave the circle behind. :) <pre><code>.image-overlay.overlay-type-extern { background: transparent; }</code></pre> Regards, Ismael johnball on "Images and Text jumps when moused over" http://www.kriesi.at/support/topic/images-and-text-jumps-when-moused-over#post-111431 Wed, 15 May 2013 17:05:50 +0000 johnball 111431@http://www.kriesi.at/support/ That removed the white box, however, the image and text still 'jump' down when moused over in Firefox. In Safari, the logo moves slightly, but the text still jumps down. Is there a way to remedy this? I liked the 'circle' when moused over. Acted as a prompt. Is there a way to get that back without the white box? Ismael on "Images and Text jumps when moused over" http://www.kriesi.at/support/topic/images-and-text-jumps-when-moused-over#post-110147 Thu, 09 May 2013 21:01:32 +0000 Ismael 110147@http://www.kriesi.at/support/ Hi, Might as well remove the circle because it is nested inside the box. You can add this on your custom.css <pre><code>.image-overlay.overlay-type-extern { display: none !important; }</code></pre> Regards, Ismael johnball on "Images and Text jumps when moused over" http://www.kriesi.at/support/topic/images-and-text-jumps-when-moused-over#post-110140 Thu, 09 May 2013 20:31:52 +0000 johnball 110140@http://www.kriesi.at/support/ A few concerns to address: My homepage has three logo images under the banner that jump downwards when you hover over them. The text spacing also jumps a little bit further away from the logos too. Is there a way to prevent them moving? Since I'm using a dark background, can I eliminate the 'white box' that shows when hovering over these logos? The circle is fine, but the box doesn't work here. <a href="http://dure.ballmedia.com/" rel="nofollow">http://dure.ballmedia.com/</a> Ismael on "Show title when "mouse over" partner logos" http://www.kriesi.at/support/topic/show-title-when-mouse-over-partner-logos#post-66812 Fri, 20 Jul 2012 23:49:14 +0000 Ismael 66812@http://www.kriesi.at/support/ Hello, Open includes > helper-templates.php find this code. <code>$img = wp_get_attachment_image( $set['img'] , 'logo' );</code> Replace it with this <pre><code>$img = wp_get_attachment_image( $set['img'] , 'logo' , '0' , $default_attr = array( 'alt' => trim(strip_tags( get_post_meta($attachment_id, '_wp_attachment_image_alt', true) )), 'title' => trim(strip_tags( $attachment->post_title )), ));</code></pre> Regards, Ismael fla_dechen on "Show title when "mouse over" partner logos" http://www.kriesi.at/support/topic/show-title-when-mouse-over-partner-logos#post-66789 Fri, 20 Jul 2012 18:28:37 +0000 fla_dechen 66789@http://www.kriesi.at/support/ Hello people, I found a thread about disabling title of images when "mouse over". What I want is the opposite: is there a way to show title when "mouse over" partner logos? Regards, Flavio Mya on "Disable titles showing when "mouse over" images ?" http://www.kriesi.at/support/topic/disable-titles-showing-when-mouse-over-images#post-64934 Wed, 11 Jul 2012 05:09:59 +0000 Mya 64934@http://www.kriesi.at/support/ Glad Ismael could help! Let us know if you have any more questions. Regards, Mya paullindqvist on "Disable titles showing when "mouse over" images ?" http://www.kriesi.at/support/topic/disable-titles-showing-when-mouse-over-images#post-64931 Wed, 11 Jul 2012 04:59:06 +0000 paullindqvist 64931@http://www.kriesi.at/support/ Thanx! Worked fine! Ismael on "Disable titles showing when "mouse over" images ?" http://www.kriesi.at/support/topic/disable-titles-showing-when-mouse-over-images#post-64917 Wed, 11 Jul 2012 04:07:38 +0000 Ismael 64917@http://www.kriesi.at/support/ Hi , Try to add this code on your footer.php and a bit above the </body> code: <pre><code><script type="text/javascript"> jQuery.noConflict(); (function($) { $('[title]').each( function() { var $this = $(this); $this.data('title',$this.attr('title')); $this.removeAttr('title'); }); })(jQuery); </script></code></pre> Hope this helps. :) Regards, Ismael paullindqvist on "Disable titles showing when "mouse over" images ?" http://www.kriesi.at/support/topic/disable-titles-showing-when-mouse-over-images#post-64864 Tue, 10 Jul 2012 21:38:35 +0000 paullindqvist 64864@http://www.kriesi.at/support/ How can i disable titles showing when "mouse over" images ? Thanx! Chris Beard on "Mouse-Over colour for social media buttons" http://www.kriesi.at/support/topic/mouse-over-colour-for-social-media-buttons#post-30730 Sun, 30 Oct 2011 02:22:22 +0000 Chris Beard 30730@http://www.kriesi.at/support/ Hi, yep, it's as simple as downloading, editing and re-uploading (& overwriting)! santara on "Mouse-Over colour for social media buttons" http://www.kriesi.at/support/topic/mouse-over-colour-for-social-media-buttons#post-30652 Fri, 28 Oct 2011 04:22:17 +0000 santara 30652@http://www.kriesi.at/support/ hi! thanks for the reply. however, im not an IT person so i don't know how to make new buttons. can i just download the files and then change their colour in a program and upload again to the same folder? Chris Beard on "Mouse-Over colour for social media buttons" http://www.kriesi.at/support/topic/mouse-over-colour-for-social-media-buttons#post-30577 Thu, 27 Oct 2011 00:19:35 +0000 Chris Beard 30577@http://www.kriesi.at/support/ Hi, thanks rumblefish for helping out, this sounds correct. santara, if you could link to your site I can provide specific instructions. rumblefish on "Mouse-Over colour for social media buttons" http://www.kriesi.at/support/topic/mouse-over-colour-for-social-media-buttons#post-30536 Wed, 26 Oct 2011 17:27:47 +0000 rumblefish 30536@http://www.kriesi.at/support/ I think the top and bottom social media icons are transparent .png files (images). So you would need to create new ones in the colour you want, then fix the css to make them change colour when you roll over them. Or you could change the colour of a background image that goes behind them. The files are in the "images" folder of the theme. santara on "Mouse-Over colour for social media buttons" http://www.kriesi.at/support/topic/mouse-over-colour-for-social-media-buttons#post-30523 Wed, 26 Oct 2011 14:18:24 +0000 santara 30523@http://www.kriesi.at/support/ How can i add a white colour mouse-over on the top and bottom social media buttons?