How to conceal the bottom bar in JQuery Colorbox iframe

I have implemented colorbox to showcase an Iframe of the registration page on my website. Here is how it looks...

https://i.sstatic.net/z1RGK.png

Upon closer inspection, I noticed a white bar at the bottom of the Iframe where the close 'X' button used to be. I have tried eliminating every visible border element using JQuery. Here is the snippet of my code...


$("#cboxTopLeft").hide();
$("#cboxTopRight").hide();
$("#cboxBottomLeft").hide();
$("#cboxBottomRight").hide();
$("#cboxMiddleLeft").hide();
$("#cboxMiddleRight").hide();
$("#cboxTopCenter").hide();
$("#cboxBottomCenter").hide();
$("#cboxClose").remove();

From what I can decipher, this should cover all the elements.

javascriptjquerycssiframecolorbox

Answer №1

Include

$("#cboxLoadedContent").hide();

at the conclusion of your jquery.colorbox.js script. :)

Spotted it using browser dev tools.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

What is the best way to ensure that the table header is printed on every page when printing?

My table has a large number of dynamic rows, and when I try to print or preview it using the window.print() function, only the table header (thead) appears on the first page. How can I make sure that the table header appears on each printed page? <div ...

javascriptphpjqueryhtmlcss

Is it possible to implement an OnMouseOver function for Canvas Arc or QuadCurve?

I am trying to create a round diagram where I want to show a div when users hover over each section (arcs). Initially, I thought about using canvas like in this example: . However, I am facing difficulties drawing an arc in canvas. Should I explore other ...

htmlcanvascss

Can you please provide a detailed list of all the events that are compatible with the updateOn feature in Angular's ngModelOptions?

The reference documentation notes the following: updateOn: a string that specifies which event should be bound to the input. Multiple events can be set using a space delimited list. There is also a special 'default' event that aligns with the ...

javascriptangularjsangular-ngmodel

Limiting Checkbox Selection and Controlling Input Box with JQuery: How to Choose Only 3 Checkboxes Simultaneously and Trigger Enable/Disable Function on Input Field

I am currently working on a feature that involves 6 checkboxes and 6 input fields. The idea is that when a user clicks on a checkbox, the corresponding input field will be enabled for data entry. If the checkbox is unchecked, the input field will be disa ...

jquery

I aim to retrieve the names of all directories

I am seeking assistance from seniors in creating a dropdown list of root directories using PHP. I have almost completed the task, but I am facing an issue with not being able to retrieve the root directory. For example, I want all directories like home/ab ...

javascriptphpajaxroot

Unload pre-loaded JavaScript documents

Two javascript files are included in a popup (simple div) created using ajax. <script type="text/javascript" src="<?php echo JS ?>pm.js"></script> <script type="text/javascript" src="<?php echo JS ?>chat.js"></script> ...

javascriptjqueryajax

My Javascript code is being modified by Wordpress to include '<p>' tags

Using the philantrophy theme, I incorporated sliders into a page using shortcodes and encountered an issue where p tags were automatically inserted into my javascript code. The following code snippet highlights the unwanted p tag added in my javascript: ...

javascriptphpwordpress

Is there a method to initiate a 'simple' action when dispatching an action in ngrx?

Here's the scenario I'm facing: When any of the actions listed below are dispatched, I need to update the saving property in the reducer to true. However, currently, I am not handling these actions in the reducer; instead, I handle them in my ef ...

javascriptangulartypescriptngrx

How to upload an Image to Cloudinary using Express.js, React, and Axios for a POST

I encountered an issue while attempting to upload images to Cloudinary using a React front-end and Express server. The problem lies in not being able to properly post request the image to my Express server. Here is how I prepare the image for sending it l ...

javascriptreactjsexpressaxioscloudinary

show the stored value inside the useRef variable

One of my challenges involves a variable const prediction = useRef<any>(null); A button triggers a function that updates the variable's value: function showResult() { classifier.current.classify(capture, (result) => { ...

javascriptreactjstypescriptreact-hooksuse-ref

What are some alternative ways to link a local MongoDB database to my Android Studio application instead of using MongoLab?

Can someone please help me figure out how to connect my Android Studio project to a MongoDB database stored locally on my PC? I've been searching for solutions that don't involve using MLab, but I haven't had any luck. I've attempted f ...

javascriptandroidnode.jsmongodbandroid-studio

Dividing Faces with Lengthy Edges in three.js into Two Separate Faces

I am currently working on a script that involves splitting overly long edges of faces into two separate faces instead of one large face. The final result is exported to a .obj file. Although the geometry reduction works fine, I have noticed some issues a ...

javascriptthree.jsgeometrynormals

show additional worth on the console

Just starting out with JavaScript. Trying to display additional values in the console. Uncertain about how to access add-ons. Can anyone help me troubleshoot? Here is my code snippet below: https://jsfiddle.net/6f8upe80/ private sports: any = { ...

javascriptjqueryhtmlangularjstypescript

Unlock the power of dynamic routes in Reactjs with this comprehensive guide

Currently, I am delving into the world of Reactjs and Nextjs, specifically working on dynamic routes. To elaborate, I have a list of blogs that I would like to showcase in detail. For this purpose, I created a folder named "blogs" and nested a file called ...

javascriptreactjsnext.js

Error: The filter argument must be in object form

Currently I am in the process of developing a REST API with an endpoint for posting movies. The request body is expected to contain only the movie title, which needs to be validated for presence. Upon receiving the title, I need to fetch other movie detail ...

javascriptmongodbexpressmongoose

Set a unique class for several elements depending on a given condition

Is there a way to assign a color class based on the element's value without looping through all elements? Check out my jsfiddle HTML <div> <ul> <li class="MyScore">90</li> <li class="MyScore"> ...

javascripthtmlcss

Learning how to access my CSS file using Express and Node.js

I am new to using express and node.js. I am trying to develop my app, but for some reason, my style.css file is not being recognized and I am unsure why. Initially, I attempted to use .scss files, but after researching, I discovered that it was not possi ...

javascripthtmlcssnode.jsexpress

Can Colorbox be configured to load specific sections of a page instead of the entire page?

After coming across this query, I've been experimenting with loading only a section of a webpage using colorbox. My current code setup is as follows: within my webpage, there's a wide array of content, but it also includes a specific div identifi ...

jqueryajaxcolorbox

The menu is not appearing in a horizontal layout

I'm encountering an issue while working on the Foundation Top Bar tutorial. When I view the code in Firefox and Chrome, the top bar displays vertically instead of horizontally. I've attempted changing the display setting to inline and inline bloc ...

htmlcssmenu

Adjustable header: resizing images and text overlay on images

Is there a way to make the images and text resize based on the size of the div or screen? I don't want the text to overflow the images when resizing. I've tried using the object-fit attribute but it hasn't worked. Any suggestions? <d ...

cssdomresponsive-design