Home Forums Air WordPress Theme Prev/Next Button Thumbnails

This topic contains 13 replies, has 3 voices, and was last updated by  SeaTheme 7 months, 1 week ago.

Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • #15294

    hau
    Participant
    Purchased

    Hi,

    how do i disable the function, that the Prev/Next buttons are showing thumbnails of Prev/next post. I would like to show the arrows only, also turn off hover animation of the arrows.

    regards

    #15297

    SeaTheme
    Keymaster
    Purchased
    Supported

    HI,
    Please paste the custom css code to “Appearance > Customize : Additional CSS”

    .navi-arrow { right: 0;left: auto;  opacity: 1; -webkit-transform: scale(1);  transform: scale(1);}
    .post-navi-unit-prev .navi-arrow { right: auto; left: 0; }
    .navi-title-tag, .navi-title-img {display: none;}
    .arrow-item:hover .navi-arrow {-webkit-transform: scale(1);  transform: scale(1);}

    regards

    #15299

    hau
    Participant
    Purchased

    Thank you,
    and how do i achieve the thickness of the + for the arrows?

    Regards

    #15301

    SeaTheme
    Keymaster
    Purchased
    Supported

    It’s possible by more custom coding job, but it’s(style custom) not included in our Free Support scope. You can hire a program engineer to work on it or use our charging services,

    #15305

    hau
    Participant
    Purchased

    OK, thank you.

    #16838

    Marilize
    Participant
    Purchased

    Hello, I would please like to find out what code I need to use in order to remove the thumbnails but keep the arrow animation?

    #16839

    SeaTheme
    Keymaster
    Purchased
    Supported

    HI,
    Please paste the custom css code to “Appearance > Customize : Additional CSS”

    .navi-arrow { right: 0;left: auto; }
    .post-navi-unit-prev .navi-arrow { right: auto; left: 0; }
    .navi-title-tag, .navi-title-img {display: none;}
    #17948

    Marilize
    Participant
    Purchased

    Hello,

    Unfortunately this has completely removed the “Next >”. I only want to remove the little thumbnail image.

    #17949

    SeaTheme
    Keymaster
    Purchased
    Supported

    Please update the custom CSS to:
    .post-navi-unit-prev .navi-title-img {display: none;}

    #17990

    Marilize
    Participant
    Purchased
    This reply has been marked as private.
    #18146

    Marilize
    Participant
    Purchased

    Is there any way to prevent the words ‘prev’ and ‘next’ (left and right side) to move so far inwards when hovering over them? So when I hover over ‘prev’ it moves very far to the right to ‘make room’ for where the thumbnail used to go. I would like it to not move so far as it looks weird and overlaps other information in mobile. Thank you in advance!

    #18147

    SeaTheme
    Keymaster
    Purchased
    Supported

    Please add the custom CSS to:

    .arrow-item:hover .navi-title-tag,
    .arrow-item.arrow-next:hover .navi-title-tag {
        -webkit-transform: translateX(0px); 
        -moz-transform: translateX(0px);
        -ms-transform: translateX(0px);
        transform: translateX(0px);
    }
    .arrow-item:hover .navi-arrow { 
        transform: translateX(120px) scale(.8);
    }
    .post-navi-unit-prev .arrow-item:hover .navi-arrow {
       transform: translateX(-120px) scale(.8);
    }
    • This reply was modified 7 months, 1 week ago by  SeaTheme.
    #18148

    Marilize
    Participant
    Purchased

    It’s giving me an error on ‘translateX’. The error says “Expected RBRACE at line 41, col 5.”

    Is there anything I can do to fix this?

    #18158

    SeaTheme
    Keymaster
    Purchased
    Supported

    Sorry, please update the CSS as:

    .arrow-item:hover .navi-title-tag,
    .arrow-item.arrow-next:hover .navi-title-tag {
        -webkit-transform: translateX(0px); 
        -moz-transform: translateX(0px);
        -ms-transform: translateX(0px);
        transform: translateX(0px);
    }
    .arrow-item:hover .navi-arrow { 
        transform: translateX(120px) scale(.8);
    }
    .post-navi-unit-prev .arrow-item:hover .navi-arrow {
       transform: translateX(-120px) scale(.8);
    }
Viewing 14 posts - 1 through 14 (of 14 total)

You must be logged in to reply to this topic.

Join Newsletter(FREE)

Subscribe to our newsletter to receive news & updates. We promise to not spam you, super promise!