[Last Call] Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 343
  • Last Modified:

Need to hide title in jQuery generated image popup

@ http://tinyurl.com/6fuecu4 I have thumbnails. Clicking on them loads a lightbox created by WP prettyPhoto. In the rounded corners popup the top title is white, too large and superfluous. Hiding it using a css rule in style.css of WP theme does not fly. Even with !important. Need to hide or not load that title. What to do?
0
rhandalthor
Asked:
rhandalthor
  • 3
  • 3
  • 2
  • +1
3 Solutions
 
BardobraveCommented:
Maybe you are not hiding it correctly in css, as that should work.

How do you hide it in style.css?
0
 
sonawanekiranCommented:
Try this. Add below jquery code in your

$(documnet).ready(function(){
  $(".pp_pic_holder .ppt").hide()
});
0
 
rhandalthorAuthor Commented:
@ Bardobrave:
div.ppt {display:hidden !important ; }

Open in new window


@ sonawanekiran: Add where? In functions.php?
0
Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
BardobraveCommented:
Display hasn't a hidden value, try this:

div.ppt {display:none; }
0
 
gavsmithCommented:
@Bardobrave

That won't work, the css is correct, it's getting an inline style from the jquery script

@rhandalthor

sonawanekiran's answer is your best bet however the pic holder is created dynamically so you would have to combine it with the 'live' function somehow. I can't think of how you would do that off the top of my head though, sorry. You should already have a $(document).ready() function in your code add it anywhere in there.

My suggestion would be to make a backup of jquery.prettyPhoto.js and remove any code blocks that reference ppt. Although this maybe difficult if you are not good with jquery code.
0
 
BardobraveCommented:
Actually I haven't looked at the code as I haven't much time to spare, but display: hidden is not a valid value and will not hide anything, as the value hidden is expected for visibility, not for display.

If the jquery script assets a display:inline style, then you should check wich style applies last, as css styles overwrite themselves, being the latest those who finally applies on the page. If the css is loaded after the jquery style change it should work, if the jquery is executed later then you should try:

div.ppt {visibility:hidden; }

Wich probably will do the trick.
0
 
gavsmithCommented:
jquery should fire events in the order they were bound so in theory you should be able to add after:

$("a[rel^='wp-prettyPhoto']").prettyPhoto({
   etc
  etc
});

$("a[rel^='wp-prettyPhoto']").click(function(){
 $(".pp_pic_holder .ppt").hide();
});

that might work??
0
 
gavsmithCommented:
bardobrave is spot on (and the solution is a lot easier) try that first!
0
 
rhandalthorAuthor Commented:
Bardobrave: && gavsmith:
div.ppt {visibility:hidden; }

Open in new window

works like a charm. Did not think about that. Awesome. Thanks!
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

  • 3
  • 3
  • 2
  • +1
Tackle projects and never again get stuck behind a technical roadblock.
Join Now