Dear friend, I would like to create a rollover image effect on the image box. This is my web site: http://www.applebyitalia.it/ can you help me to change css code? Best regards Dante
Hello Dante, Greetings from InkThemes! Please paste the code given below in Custom CSS field(Appearance -> Theme Options -> Styling Options -> Custom CSS) of your dashboard. Code: .feature_inner_box .circle img:hover { background: red !important; } Note: you can also add an image to show while on hovering and for that you just need to use url('your image link') instead of red in above code. Hope it will resolve your issue Do let me know if you need more assistance, Thanks & Regards! Priyanka InkThemes.com
I have a problem. I have two image with rollover image. I uploaded the first image one with theme options page. The second image: code .feature_inner_box .circle img:hover { background-image: url("http://www.applebyitalia.it/wp-content/uploads/2015/12/libro-on.png"); Every box has to have its rollover image. Could I change front-page.php for the first boxes images? ---- <div class="grid_6"> <div class="feature_inner_box"> <?php if ( inkthemes_get_option('inkthemes_fimg2') !='' ) { ?> <div class="circle"><a href="<?php echo inkthemes_get_option('inkthemes_feature_link2'); ?>"><img src="<?php echo inkthemes_get_option('inkthemes_fimg2'); ?>" alt="Feature image" /></a></div> <?php } else { ?> <div class="circle"><a href="<?php echo inkthemes_get_option('inkthemes_feature_link2'); ?>"><img src="<?php echo get_template_directory_uri(); ?>/images/circleimg2.png" alt="Feature image" /></a></div> <?php } ?> <?php if ( inkthemes_get_option('inkthemes_headline2') !='' ) { ?> <h2 class="feature_title"><a href="<?php if ( inkthemes_get_option('inkthemes_feature_link2') !='' ) { echo inkthemes_get_option('inkthemes_feature_link2'); } ?>"><?php echo stripslashes(inkthemes_get_option('inkthemes_headline2')); ?></a></h2> <?php } else { ?> <h2 class="feature_title"><a href="<?php echo inkthemes_get_option('inkthemes_feature_link2'); ?>">Premium WordPress Themes with </a></h2> <?php } ?> ------ Can you help me please? Thanks & Regards! Dante
Hello Dante, You have to assign a different class name for each feature box and with the help of that particular class name you can apply CSS to your desired feature box separately. as, you can create <div class="feature_inner_box box1 "> instead of <div class="feature_inner_box"> and after assigning different class name you can put CSS for that particular class only. like: Code: .box1:hover { background-image: url("http://www.applebyitalia.it/wp-content/uploads/2015/12/libro-on.png"); } Hope you will understand. Do let me know if you need more assistance, Thanks & Regards! Priyanka InkThemes.com
Hello Priya I have some problems. I uploaded my new front-page.php and style.css You move the mouse on the contact area footer. You can see the image. Thanks & Regards! Dante This is my box code. <div class="feature_inner_box last"><?php if ( inkthemes_get_option('inkthemes_fimg4') !='' ) { ?> <div class="circle"><a href="<?php echo inkthemes_get_option('inkthemes_feature_link4'); ?>"><img src="<?php echo inkthemes_get_option('inkthemes_fimg4'); ?>" alt="Feature image" /></a></div> <?php } else { ?> <div class="circle"><a href="<?php echo inkthemes_get_option('inkthemes_feature_link3'); ?>"><img src="<?php echo get_template_directory_uri(); ?>/images/circleimg4.png" alt="Feature image" /></a></div> <?php } ?> <?php if ( inkthemes_get_option('inkthemes_headline4') !='' ) { ?> <h2 class="feature_title"><a href="<?php if ( inkthemes_get_option('inkthemes_feature_link4') !='' ) { echo inkthemes_get_option('inkthemes_feature_link4'); } ?>"><?php echo stripslashes(inkthemes_get_option('inkthemes_headline4')); ?></a></h2> <?php } else { ?> <h2 class="feature_title"><a href="<?php echo inkthemes_get_option('inkthemes_feature_link4'); ?>">Premium WordPress Themes with</a></h2> <?php } ?> This is css code .last:hover { background-image: url("http://www.applebyitalia.it/wp-content/uploads/2015/12/libro-on.png"); background-repeat: no-repeat; }
Hello, You can paste the code given below in Custom CSS section (Appearance -> Theme Options -> Styling Options -> Custom CSS) of your dashboard to avoid the background effect from the footer area.. Code: .footer_widget.last:hover { background-image: none !important; } Hope it will resolve your issue Do let me know if you need more assistance, Thanks & Regards! Priyanka InkThemes.com
Hello, the footer is ok! Thanks! I have a problem on rollover image. Can you check the university button (pink)? I have to cancel: - Black border - the enlarge button effect I would like a simple rollover image. I uploaded an image. web site: http://www.applebyitalia.it/ Thanks and regards Dante
Hello Dante, Please paste the code given below in Custom CSS section (Appearance -> Theme Options -> Styling Options -> Custom CSS) of your dashboard. Code: .feature_inner_box .circle:hover { border: none !important; } .last:hover { background-image: none !important; } Hope it will resolve your issue Do let me know if you need more assistance, Thanks & Regards! Priyanka InkThemes.com
Hello Priya, I have a problem on rollover image (pink). It doesn't work.good solution! this is style.css code .last:hover { background-image: url("http://www.applebyitalia.it/wp-content/uploads/2015/12/libro-on.png"); background-repeat: no-repeat; Thanks & Regards! Dante
Hello Dante, Let me clear you first that you are using an image as the hovering effect.. So it would be difficult to removing the only pink circle from there... Hope you will understand. Do let me know if you need more assistance, Thanks & Regards! Priyanka InkThemes.com
Dear Priya I don't understand! I have two image 1) book image 2) text image (http://www.applebyitalia.it/wp-content/uploads/2015/12/libro-on.png) How can I have a rollover image ? web site: http://www.applebyitalia.it/ Thanks & Regards!
Hello, Would you please send us your dashboard details at [email protected] along with this thread link as well and your desired place where you want to show the hovering effect and we will do it for you? Looking forward to your reply. Thanks & Regards! Priyanka InkThemes.com
