CODEWITHSUNDEEP
jqueryhtmlbuttoncolorbox
Rick Helston
Rick Helston

Reputation: 763

jQuery Colorbox Buttons

I'm trying to use jQuery Colorbox as a lightbox but the left, right and close buttons are not showing up at the bottom (click "dasdsadsa"):

http://zero6media.com/gee/wordpress/joes-calculator/

However, if I use the same code in a fiddle it works:

http://jsfiddle.net/4k1ty7wf/

jQuery(document).ready(function(){
    jQuery("a[class='web']").colorbox({width: "600px", height: "600px", maxWidth: "95%", maxHeight: "95%", html: "Hello", opacity: ".75",
rel: "group1", current: 0});
});

Why are the buttons not showing up on my first page?

Upvotes: 0

Views: 700

Answers (1)

AtanuCSE
AtanuCSE

Reputation: 8940

Some resource are not loaded in your actual web page

enter image description here

Failed to load resource: the server responded with a status of 404 (Not Found)
(index):1968Consider using 'dppx' units, as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query expression: only screen and (-webkit-min-device-pixel-ratio: 1.3), not all, only screen and (min-resolution: 120dpi)
http://zero6media.com/gee/wordpress/wp-content/uploads/2015/02/51.png Failed to load resource: the server responded with a status of 404 (Not Found)
http://mymoviesdb.jgportfolio.com/css/wufoo.css Failed to load resource: the server responded with a status of 404 (Not Found)

I think one of them is responsible for this CSS property that you added in jsFiddle manually

        #cboxPrevious,#cboxNext,#cboxClose,#cboxSlideshow{position:absolute;bottom:-29px; background:url(http://www.jgportfolio.com/images/colorbox/controls.png) no-repeat 0px 0px; width:23px; height:23px; text-indent:-9999px;}
        #cboxPrevious{left:0px; background-position: -51px -25px;}

Your actual page is missing this property. I think that's because of those missing css links. Make sure all your css script paths are okay. Check in browser's 'inspect element' to ensure if they are added properly.

Upvotes: 1

Related Questions