Site logo

Archived topic

Effect in entry problem

15 replies · Started by casimiro on January 29, 2019

Viewing posts 1–15 of 16

Hi
I don't know if this will be problem of the generatepress theme.
I miss what happens with webkit effect in an entry. If I see it with the permanent link the effect goes well, but if I see it on live the effect doesn't appear. It can be by the name of the page.
thanks

Hi
Well, if I put an effect on an image, this effect is not seen on the main page, but yes on the link. I have made a new entry called "prueba" so you can understand it.

Where are you adding the CSS?

In the Simple CSS metabox of that post?

In the post, because I want it to be individual for each image.
Thanks

CSS added in the post will only work on that post. Not the home page.

You will have to add another line using this selector:
.blog .blur img

It isnt very good if it's applied to all the images of the blog.
Anyway, I add that line but nothing changes.
Now I've at post
<div class="blur"><img src="http://www.xxx.com/wp-content/uploads/image.jpg" alt="" width="300" height="200" /></div>

and CSS it's

.blog
.blur img{
            -webkit-webkit-transition:all 1s ease;
            -moz-webkit-transition:all 1s ease;
            -ms-webkit-transition:all 1s ease;
            -o-webkit-transition:all 1s ease;
       }

.blur img:hover{
   -webkit-filter:blur(4px);
       }

My selector shouldn't add the effect to all the images on the blog page, only the one with blur class.

Hi Leo
Then something I'm doing wrong.
Have you seen the code I've put before?
Is there something wrong with it?
Because I don't see any change
Thanks

That's not the selector I suggested above.

Try this:

.blog .blur img,
.blur img{
            -webkit-webkit-transition:all 1s ease;
            -moz-webkit-transition:all 1s ease;
            -ms-webkit-transition:all 1s ease;
            -o-webkit-transition:all 1s ease;
       }
.blog .blur img:hover,
.blur img:hover{
   -webkit-filter:blur(4px);
}

Nothing, keep doing the same.
The effect doesn't work in the first image.
:(

I'm not seeing my CSS being added.

Did you clear the caching plugin after the change?

Yes, of course
the entry html
<div class="blur"><img class="aligncenter size-medium wp-image-xxxxx" src="http://www.my site/wp-content/uploads/image.jpg" alt="" width="300" height="200" /></div>
the CSS added in the entry on Simple CSS:

.blog .blur img,
.blur img{
            -webkit-webkit-transition:all 1s ease;
            -moz-webkit-transition:all 1s ease;
            -ms-webkit-transition:all 1s ease;
            -o-webkit-transition:all 1s ease;
       }
.blog .blur img:hover,
.blur img:hover{
   -webkit-filter:blur(4px);
}

Are you still adding the CSS in the metabox of that post?

As I mentioned above, CSS added in the post will only execute on that specific post.

Try adding it under the global Simple CSS editor then you should be able to use your original CSS.

OK
Thats right Now it's stay working.
Thanks Leo
But a doubt
I have to put in each entry that I want the effect in their particular CSS.
Is that so?

This archived topic is closed to new replies.