The plugin works in Chrome and Firefox. However, in IE8 it repeats half of the image, as if it’s a repeating background. Also, the dynamic menus fall behind the image. Please see http://d3530684.u264.webdancers.com/additions-remodels/ and see if the issue can be replicated.
I hope this can be fixed. It is the perfect effect for my application.
On checking your site code I noticed that your after image height is greater than before image
can you make both images same sizes and recheck again if same problem persists.
And When I checked dynamic menus are showing over the images?
Good catch, I missed that. However, after resizing the images to the same height and width, uploading them again and inserting onto the page, I still have the same problem of the images repeating in IE8. The dynamic menu is displaying correctly. Any ideas?
Can you create a test post with below code directly
(Do it in html mode)
<div class="ba-container" id="ba-container-1"><div><img src="http://d3530684.u264.webdancers.com/wp-content/uploads/2011/05/before01.jpg" alt="" title="before01" width="432" height="289" class="alignleft wp-image-103" /></div><div><img src="http://d3530684.u264.webdancers.com/wp-content/uploads/2011/05/after01.jpg" alt="" title="after01" width="432" height="289" class="alignright wp-image-102" /></div></div>
I am assuming that this is your test site so can you switch to default theme once and see if you get the same problem?
This code works, even not using the default theme. See http://d3530684.u264.webdancers.com/test/.
I am not sure but your test page does not seem to be able to find the images?
Also if the above code worked, then there is some issue with css settings
I just removed
Can you see what your css is setting for size-full class?
I decided to go back to the source, so I de-activated the plugin and added jquery.beforeafter manually to the site. My test page contains no code generated by WordPress and I made sure that the two images are the same size.
IE still displays the repeating image. Chrome does not display the image at all, only the “Show only before” and “Show only after” links. Firefox displays the slider effect but has problems with the left/right arrows and displaying the division between before and after properly.
IE8 64-bit v8.07600
Chrome 12.0.742.53 beta-m
Test page: http://d3530684.u264.webdancers.com/test/
I’m not seeing any other reports of these problems, so any help you can offer would be appreciated.
Have pushed a update 0.1.4
Please test with the new version and let me know
Moving in the right direction but not there yet.
I re-enabled the updated plugin and added images in the HTML panel of the editor. I used the Before After button in the toolbar and the “Add an image” button. In other words, I did not add the code by hand and it includes whatever classes WordPress normally adds.
In both Chrome and IE I get a single image of the “before” photo. Above the photo is the following error message:
Warning: strpos(): Offset not contained in string in /hsphere/local/home/wd-wordpress/rcaldera.com/wp-content/plugins/before-after/before-after.php on line 173
Update: I forgot to remove the code that I had added manually for jquery.beforeafter. Once I did that, The behavior remained the same as described above in Chrome. In IE, I get the repeating image again. You can see both of these effects on the test page.
seems like there is one image missing on your site even in the code itself?
can you post the code from the post here including the before after tags copy it from the html view of post editor
HTML view from editor:
[beforeafter]<img class=”alignleft size-full wp-image-209″ title=”before_test” src=”http://d3530684.u264.webdancers.com/wp-content/uploads/2011/05/before_test.jpg” alt=”” width=”432″ height=”280″ /><img class=”alignright size-full wp-image-208″ title=”After test” src=”http://d3530684.u264.webdancers.com/wp-content/uploads/2011/05/after_test.jpg” alt=”” width=”432″ height=”280″ />[/beforeafter]
Please update to V0.1.5 and
from your code remove the size-full from both image tags and retest it for IE and chrome and let me know the results
No improvement. Images displayed correctly in Chrome on first load but on reload they disappeared. The “Show Only Before” and “Show Only After” links are still there. IE still displays the repeating images.
When I tested on my test blog IE part it worked yesterday
Today in IE its still working but chrome issues started again
Can you check with the default theme of wordpress on your test site?
Everything did work correctly on a quick test using the Twentyten theme. I am using a custom child them on the Thematic framework. If Before/After can’t work with this theme, I’m afraid I’ll have to abandon it. I’m also going to have to take a few days off this project to work on other things. If you can think of anything else for me to try, I’ll take it up again next week. Thanks for all your help.
- The topic ‘[Plugin: Before After] Issues in IE’ is closed to new replies.