Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Feb 2011
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    jCaption and IE Hyperlink Bug - will pay for the solution!!!

    Hello,

    I am very frustrated with this bug and I am willing to pay for the correct solution. It involves jQuery, the jCaption plugin and IE.

    Basically what happens is that when jCaption is being used on an image in IE, the image hyperlink does not work correctly. The hyperlink only works for the caption portion of the image. I need it to work for the entire image.

    This is urgent, and I willing to pay up to $50 for the solution via PayPal.

    You can view an example here: http://shooters.tgmtestserver.com/talent/

    Hover over the image in IE and try to click on the image. The hyperlink does not work for the image, only the caption. This needs to be fixed.

    Thomas

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,853
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    In your html file, change
    Code:
    <script type="text/javascript">
    $('img.captify').jcaption({
    	wrapperElement: 'span',
    	wrapperClass: 'caption',
    	captionElement: 'span',
    	imageAttr: 'alt',
    	requireText: true,
    	copyStyle: false,
    	removeStyle: true,
    	removeAlign: true,
    	copyAlignmentToClass: false,
    	copyFloatToClass: true,
    	autoWidth: true,
    	animate: true,
    	show: {opacity: 'show'},
    	showDuration: 400,
    	hide: {opacity: 'hide'},
    	hideDuration: 400	
    });
    </script>
    In custom.css
    Code:
    /* :..[ Image Captions ]..: */
    span.caption { margin: 0; padding: 0; position: relative; }
    span.caption span { position: absolute; margin: 0; padding: 10px 0 10px 10px; font-size: 22px; bottom: 0; left: 0; background: #fff; color: #111; opacity: .75; filter: alpha(opacity=75); width: 99%; cursor:pointer;}
    span.caption img { margin: 0; padding: 0; }
    and replace your jcaption.js with the attached one (rename .txt to .js)
    Edit:
    Basically, your jcaption script makes your markup invalid, since you can't nest a block level element like <div> or <p> inside an inline element like <a>. I've changed all "caption elements" to span and changed css and js accordingly.


    Good luck!
    Attached Files Attached Files
    Last edited by abduraooft; 02-28-2011 at 08:06 AM.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #3
    New to the CF scene
    Join Date
    Feb 2011
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    This solution worked like a charm! Thank you so much.


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •