Site URL: http://herzbergdesign.com
Hi all,
I'm working on the website for my design business (not web design, obviously), and am having a small issue.
I am using custom images with click-through links, and added a piece of CSS I found online that expands these images when you hover over them (using them on home page as well as a few others).
The issue is that they only work after a few page reloads (or very specifically, reloading the "branding" page will make them work throughout the website). After some thorough Googling, I am under the impression that this has to do with AJAX loading. I'd rather not turn this off just to make some dumb CSS animations work. Is there an easy way to make this work? Here's the code:
a img.thumb-image {
display: inline-block;
vertical-align: middle;
-webkit-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0, 0, 0, 0);
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
-moz-osx-font-smoothing: grayscale;
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
-webkit-transition-property: transform;
transition-property: transform;
}
a img.thumb-image:hover,
a img.thumb-image:active {
-webkit-transform: scale(1.1);
transform: scale(1.1);
}