Background image of HTML Iframe element does not display - Inline style block

https://i.stack.imgur.com/JW26M.png

After setting the iframe's innerHTML using this line of code:

iframedoc.body.innerHTML = tinyMCE.activeEditor.getContent();

The styles for the elements within the iframe are contained in an inline style block. However, when I try to set the entire document using 

document.write(iframedoc.body.innerHTML)
, I encounter an issue.

Upon doing so, the resulting display appears as such:

In particular, there seems to be a problem with displaying the background-image assigned to the #logo element. Here is its corresponding style:

#logo {
    float: left;
    width: 1170px;
    height: 119px;
    text-align: left;
    margin: 0;
    padding-left:335px;
    background: url(allegroImg/bannerTop2.png) no-repeat;
}

Could someone help diagnose what might be causing this issue? Why isn't the background-image showing up as expected?

javascriptjqueryhtmlcssiframe

Answer №1

My initial question was regarding the image source, but I figured it out on my own.

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

Is there a way to transform an HTMLCollection into an array without depleting it of its elements?

I've been attempting to transform a collection of 4 divs in HTML into an array, but all my efforts seem to lead to the array becoming void. <div class="container"> <div class="shape" id="one"></div> <div class="sh ...

javascripthtmlarraysdom

Achieving uniform alignment of multiple field labels in Bootstrap and Simple Form

Here is the current layout of my form: https://i.sstatic.net/2vZjl.jpg You may notice that the labels are not properly aligned. I would like them to appear like this: https://i.sstatic.net/gm39D.jpg Below is the code for all the input fields: <%= si ...

htmlcssruby-on-railstwitter-bootstrapsimple-form

Using PHP's include/require method with a dynamic path

Looking for assistance with my issue! Ajax is returning the correct information and displaying it in an 'alert(html)' on 'success'. The PHP code echoes $idName and $path correctly on the carrier page where the code resides. There are no ...

javascriptphphtml

Configuring Dialog Placement to the Top in Material-UI

I'm in the process of creating a popup dialog, but I'm encountering an issue where the dialog pops up in the center of the page. How can I position it at the very top of the page when the popup button is clicked? Below is the code snippet: < ...

javascripthtmlcssreactjsmaterial-ui

Having difficulty compiling Bootstrap css with grunt

After struggling for two days and finding numerous online tutorials, I still require assistance. My goal is to add a namespace to Bootstrap so that I can use it in Salesforce without conflicting with Salesforce's stylesheet. I plan on wrapping the boo ...

csstwitter-bootstrapgruntjsless

Finding the Right Path: Unraveling the Ember Way

Within my application, I have a requirement for the user to refrain from using the browser's back button once they reach the last page. To address this, I have implemented a method to update the existing url with the current page's url, thereby e ...

javascriptember.js

Achieving targeted text display on specific viewports using the visible class in Bootstrap

I've recently delved into learning Bootstrap, and I'm experimenting with creating a responsive page where certain divs will only be visible on specific viewports. I used classes like visible-xs, visible-sm, visible-md, and visible-lg for the diff ...

htmlbootstrap-4

JavaScript Empty Input Field when Duplicating Node

I am seeking advice on how to clear the textboxes when an HTML form is cleared. The following JS code runs onclick: var counter = 0; function moreField() { counter++; var newFields = document.getElementById('readroot').cloneN ...

javascripthtmlvisual-studioclone

Implementing a Jquery check based on a checkbox

Hey, I'm having an issue with a condition. When I uncheck the checkbox, it doesn't uncheck. I've tried to make a block display, but the JavaScript isn't working. I attempted to add: document.getElementById("Reload").style.display = "b ...

javascriptjqueryhtmlcssbootstrap-4

Sending a unicode PHP variable to JavaScript is a breeze

I am attempting to transfer the titles and excerpts of Persian Wordpress posts to JavaScript. Below is the code in a .php script file: function change(){ document.getElementById("link").innerHTML = '<a href="$links[2]">$titles[2]< ...

javascriptphpjson

Add a fresh category to a JSON document

Combining Express (Node.js) and Mongoose, I am developing a REST API and attempting to implement JWT token-based login. However, I have encountered an issue. Upon executing the code below: const mongoose = require('mongoose'); const User = mongo ...

javascriptjsonnode.jsexpress

Having trouble clicking or interacting with JavaScript using Selenium and Python

Issue: Unable to interact with elements on a specific webpage after opening a new tab. Using WebDriver Chrome. I can successfully navigate the initial webpage until I click a link that opens a new tab, at which point I am unable to perform any actions. ...

javascriptpython-3.xseleniumselenium-webdriver

Transforming jQuery code to pure vanilla Javascript

For my project, I decided to convert my jQuery code into native JavaScript. The goal is to eliminate the dependency on jQuery and achieve the same functionality. The current setup involves two pages - page.html and side.html. The page.html document fetches ...

javascriptjqueryhtml

Tips for managing and modifying information with a dropdownlist in asp.net core mvc and angular js

In my asp.net core MVC project, I am incorporating AngularJs to manage two dropdown lists and a textbox. While the textbox functionality for saving and editing data works well, I am facing issues with resetting the dropdown lists after posting data and not ...

javascriptc#angularjsasp.net-coreasp.net-core-mvc

Adding options for a select tag from JavaScript can be accomplished by using the DOM manipulation methods

I am working on a form that includes drop-down menus. The options for the select tag need to change dynamically based on the id value. For instance, if the id is 1, the select tag options should be cat and dog. If the id is 2, the options should be apple ...

javascriptjqueryruby-on-railsruby-on-rails-3

Receive AJAX aid for PHP/MySQL dynamic dropdown menu implementation

My goal is to dynamically populate a second drop-down menu based on the selection made in the first drop-down. The first drop-down contains a list of tables from my database, and the second drop-down should display providers associated with the selected ta ...

javascriptphpjquerymysqlajax

Make sure to validate onsubmit and submit the form using ajax - it's crucial

Seeking assistance for validating a form and sending it with AJAX. Validation without the use of ''onsubmit="return validateForm(this);"'' is not functioning properly. However, when the form is correct, it still sends the form (page r ...

javascriptphpjqueryajax

Exploring the Methods to Monitor Variables in Framework7 Store

Currently, I am in the process of developing my app and have opted to utilize the new built-in store system instead of relying on Vuex. I have a variable that undergoes frequent changes and previously used the following code when working with Vuex: store.w ...

javascriptvue.jsstorehtml-framework-7

How can Vue define the relationship on the client-side when submitting a post belonging to the current user?

Currently, I am developing an application using Node.js, specifically Express server-side and Vue client-side, with SQLite + Sequelize for managing the database. One of the features of this app is that a user can create a post. While this functionality ex ...

javascriptexpressvue.jssequelize.jsvuex

What is the most effective way to display a card with varying values depending on the user's input in a form?

For a while now, I've been grappling with a particular challenge. In my project, I am utilizing multiple states to display values within a card after they are entered into a form. The first state captures the values and modifies the initial state, whi ...

javascriptreactjs