My HTML page consists of 2 div blocks and 2 links. I want to open the content of the first div in a new window when the first link is clicked, and the content of the second div in another new window when the second link is clicked.
You can find the code here - http://jsfiddle.net/PAJWV/5/
I know it seems impossible, but if there's a workaround, please let me know. Thank you!
function printWebpage(divId)
{
elementIdentifier=divId;
var contentToPrint = document.getElementById(elementIdentifier);
var urlForWindow = 'about:blank';
var uniqueTitle = new Date();
var windowTitle = 'Print' + uniqueTitle.getTime();
var printerWindow = window.open(urlForWindow, windowTitle,'left=500,top=500,width=500,height=500');
printerWindow.document.write('<html><head></head><body>'+contentToPrint.innerHTML+'</body></html>');
}
Test the code above by triggering the function onclick event
To implement this solution, simply create a new page containing the contents of div1 and div2, then execute your script to display each page accordingly. Utilize iframes to fetch content from external files for both div1 and div2.
By following this approach, you can effectively manage and display multiple div elements on separate pages with ease.
Have you tried using this method before?
Give this code a try:
This code may not work smoothly on jsfiddle, but it should run seamlessly with the actual code because of certain limitations.
I haven't personally tested this method, but you could potentially link to another section on a webpage using:
window.open("index.html#second");
In addition, ensuring that other divs with IDs not equal to #second are hidden should function properly.
To have separate HTML files for div1 and div2, follow the steps below:
window1.html
<body>
<div id="first">
Contents of First Div.
</div>
</body
window2.html
<body>
<div id="second">
Contents of Second Div.
</div>
</body
main.html
<div>
<a id="link1" href="window.open('window1.html')">Open div 1</a><br />
<a id="link2" href="window.open('window2.html')">Open div 2</a>
</div>
I've been working on creating Cognos reports and I'm looking to change the overall design of some specific ones (prompt pages and report pages). Is there a way for me to use different custom CSS files for each individual report? If that's ...
Successfully implemented code: <script src="https://cdnjs.cloudflare.com/ajax/libs/animejs/2.0.2/anime.min.js"></script> <script type="text/javascript"> var textWrapper = document.querySelector('.ml6 .letters'); textWrapper.in ...
Is there a way for me to make my CSS animation functions more efficient? I have similar functions for different properties like height, width, and left. Can I modify the function below to accept a CSS property argument instead of hardcoding height? Window ...
https://i.stack.imgur.com/PIMR2.png Hey everyone, I'm working on creating a Divider for every row of 3 items. Currently, my setup only handles two sets of rows, but there could be an unlimited amount of rows that need this divider. I am using slice t ...
Take a look at this fiddle I created: http://jsfiddle.net/7wp9rs2s/. This is the progress I have made on my project so far. In the fiddle above, you can double click on one of the 4 items and a textbox will appear for editing. Instead of clicking out of t ...
db.js const mongoose = require('mongoose'); const mongoURI = "mongodb://localhost:27017/?readPreference=primary&appname=MongoDB%20Compass&ssl=false"; const connectToMongoDb = ()=>{ mongoose.connect(mongoURI, ()=>{ ...
In our table consisting of 6 rows and 2 columns, the second column displays a Font Awesome circle followed by various values in the database field (such as Outstanding, Very Good, Good, Needs Improvement, and Adequate). I am looking to dynamically change ...
In my DOM, I have two separate elements that need to change when either one is hovered over. If the link is hovered over, not only does the image src need to change (which is easy), but also the link color needs to change. Similarly, if the image is hovere ...
As a beginner with Next.js, I am seeking guidance on utilizing getStaticPaths and getStaticProps within catch-all routes. Many blog starters for Next.js 9.3+ focus on single-level blog posts (such as /posts/post-1.md, /posts/post-2.md, etc.), but I am stru ...
I have a question regarding a Link element and CustomButton element with an onClick handler. < Link to = "/dashboard" style = { linkStyles } > < CustomButton text = "Login" onClick = { handleSubmit } /> < /Link> The code ...
After facing difficulties in customizing the spacing of Angular material cards, I decided to create my own cards. However, during this process, I encountered an issue where I needed to set an image as a background inside a div. Despite trying various CSS ...
I am currently working on a threejs application that requires updating a texture in each frame. The output encoding of the THREE.WebGLRenderer is set to sRGB. Upon setting the texture encoding to sRGB, I observed that the rendering result is accurate. How ...
When attempting to update the user thunk action by passing an axios instance as an extra argument, I am encountering difficulties in accessing the extra argument. Despite being able to access other fields such as getState</coode> and <code>disp ...
While working on a basic Discord bot, I encountered an issue when running the -setcaps command. The error message I received was: TypeError: Cannot read property 'id' of undefined. I'm unsure about what might be causing this error. Any a ...
The script below, taken from a tutorial by Adam Khoury, is designed to create a timer that displays a message once it reaches completion. While I grasp the overall functionality of the code, I'm puzzled by the use of strings in certain parts: 1) Why ...
I have a specific file where I declared the URL for my videouploadfolder, and now I need to reference that file in my JavaScript config.js. var filepath = { uploadVideoUrl : './public/videos' } In my Node.js script, I included it like th ...
In my project, I have decided to use input type date instead of datepicker. Is there a way to prevent users from selecting back dates in input type date without using datepicker? If you have any suggestions, please let me know. Thank you! ...
Having experience with Angular JS 1 in my projects, I have always found it to work well. However, I recently encountered a project that uses Python and Django, with some pages incorporating Angular. The specific page I needed to work on did not have any An ...
I am attempting to develop a unique interactive experience where an image placed within a container extends beyond its boundaries. The concept involves moving the image in the opposite direction of my mouse as I hover over the container. The speed and inte ...
Utilizing the autosuggestion plugin with the onSelect option that changes values in other fields is causing an issue. Everything works fine initially when selecting an item, but when clicking on the input field with the .auto class for the second time (whe ...