What is the best method to make a hyperlink within an IFrame open in a new window?

Let me share the code I've been working on:

<!DOCTYPE html> 
<html> 
 <head>
<base target="_blank">
</head>
<body> 

<div style="border: 2px solid #D5CC5A; overflow: hidden; margin: 15px auto; max-width: 800px; max-height: 1750px;">
<base target="_blank" />
<iframe name="myIframe" scrolling="auto" src="http://example.com" style="border: 0px none; margin-left: -30px; height: 4000px; margin-top: -900px; width: 850px;">
</iframe>
</div>
</body> 
</html>

I attempted to use the target attribute without success. Any suggestions would be greatly appreciated.

javascriptjqueryhtmlcssiframe

Answer №1

Here's a solution that might work for you:

<!DOCTYPE html> 
<html> 
 <head>
<base target="_blank">
</head>
<body> 

<div style="border: 2px solid #D5CC5A; overflow: hidden; margin: 15px auto; max-width: 800px; max-height: 1750px;">
<base target="_blank" />
<iframe name="myIframe" scrolling="auto" src="http://example.com" style="border: 0px none; margin-left: -30px; height: 1000px; width: 850px;">
</iframe>
</div>
</body> 
</html>

I made a minor adjustment by removing the margin-top: -900px to ensure the document fits within the view area.

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

In a React application, the input field unexpectedly loses focus after typing just one character

Has anyone encountered an issue with a dropdown menu causing input field focus to be lost after typing one character? I've attempted setting unique keys for each field, but it hasn't resolved the problem. For reference, here is the link to the p ...

javascripthtmlreactjsreact-hooks

Tips for generating a fixed-length array from multiple arrays with different lengths, focusing on selecting items from each array according to their significance

In order to create a quiz, I am looking to extract 'questions' from various 'topic' arrays. These topics are selected based on the user's preference and are used to populate a question bank for a 20-question quiz. The topics rated ...

javascriptarraystypescriptsortingweighting

Deleting multiple subdocuments and their related subdocuments with Mongoose

In my application, I have a Project document that contains an array of subdocuments structured as Tasks. Each Task has its own array of subdocuments with a schema called Comments. const projectSchema = new Schema({ _id: Schema.Types.ObjectId, name: { ...

javascriptmongodbexpressmongoose

Sort through the array using a separate array in Vuejs

I am currently working with two arrays: { "products": [ { "name": "Jivi", "Hint": "45-60 IE/kg alle 5 Tage\n60 IE 1x/Woche\n30-40 IE 2 x/Woche", "frequency": ["1", "2", "8"] }, { "name": "Adynovi", ...

javascriptarraysvue.jsvuejs3

What's the significance of the #/ symbol in a URL?

Currently, I am developing Ruby on Rails web applications. The URL of my webpage appears as follows: http://dev.ibiza.jp:3000/facebook/report?advertiser_id=2102#/dashboard From this link, I have identified that the advertiser_id is 2102 but I am unsure a ...

htmlruby-on-railsangularjswebfragment-identifier

React: Assigning a unique className to an element in a list

In the code snippet below, I am attempting to add a className based on the state of the checkbox. While the className is being added correctly, the issue arises when it gets applied to all elements in the list upon checking/unchecking any checkbox. I aim ...

javascriptreactjs

At all times, AJAX/PHP/JS will have a readyState of 1 and a Status of 0, with no text response

Recently, I've been attempting to utilize a sample of AJAX to compare form data with an SQL database from a domain at http://www.example.com. However, I'm encountering persistent issues where the readyState remains at 1 and the Status is always 0 ...

javascriptphpajax

Import a JavaScript file with beneficial test functions for selenium testing

Utilizing the runScript command in selenium has proven to be incredibly helpful for me. I've been using it to calculate values within a table and then store the result like so: <tr> <td>runScript</td> <td>var cumulativ ...

javascriptseleniumautomated-testsselenium-rcselenium-ide

Collaborating with multiple forms and files in PHP using jQuery and AJAX operations

Need help with the title for this question. There are two input fields and buttons in index.php <form action="<?php echo $_SERVER['PHP_SELF'] ?>" method="POST"> <input type="text" class="for ...

javascriptphpjqueryajaxforms

Which element is able to utilize the inline-block style?

Currently, I am delving into the intricacies of the inline-block attribute and have a basic understanding that it allows elements to sit on the same row rather than stack on top of each other as they would in a normal layout. However, my grasp on how exact ...

htmlcss

Retrieve the class that corresponds to the element in the given list

In my JavaScript code, I have a NodeList of elements that were selected by querying multiple classes. I am using a "for" loop to iterate through the list. What I need is a concise one-liner to quickly determine which class each element was selected by so I ...

javascripthtmldom

What is the best way to utilize the GET Method with a hashtag incorporated into the URL?

For instance: www.sample.com#?id=10 Currently, I am not able to retrieve any value from $_GET['id']. Despite my attempt to eliminate the hashtag from the URL using JavaScript, no change occurs: $(document).ready(function(){ $(window.location ...

javascriptphpjqueryajaxhash

"Unveiling the Power of PWI: Integrating Picasa Web Albums with the Magic of jQuery

I am currently having an issue with the script found here: http://code.google.com/p/pwi/ It's a fantastic Picasa jQuery Gallery! Could someone please provide guidance on how to run this script in jQuery.noConflict() mode? I have already included the ...

gallerypicasajquery

Switch from using pure JavaScript to jQuery or back

While I can navigate through jquery, javascript is a bit more challenging for me. I have a simple function that's coded in javascript, but I need to update the selectors. Changing them in jquery wouldn't be a problem for me, but it's tricki ...

javascriptjquery

The AJAX data variable fails to send to PHP script although $_POST is defined

I am at my wit's end with this problem. I am attempting to send a variable to a PHP script using AJAX, and although I can confirm that $_POST is set, the variable remains undefined. Oddly enough, I have used almost the same code in other instances an ...

javascriptphphtmlajax

Executing PHP script using HTML button in combination with Ajax and Javascript

I have a PHP function that I would like to execute from an HTML button that I have. The PHP function is located in a separate file from the HTML button. I have achieved this using: <input type="submit" name="test" id="bt1" value="RUN" /><br/> ...

javascriptphpjqueryajaxfunction

Using Jquery $.ajax may lead to temporary freezing of the Browser

I have a $ajax function that fetches multiple JSON objects from a URL and converts them into divs. There are around 50 objects, and I am using setInterval to call the $ajax function every 10 seconds for updates on each of the created divs. However, I' ...

javascriptjquery

Display a preview of a React component

Currently facing a challenge where I need to create a form for users to adjust the title, background color, button background, text color, and other settings of a component. I want to provide a live preview of the component as the user makes changes. I en ...

javascriptcssreactjsreact-reduxstyled-components

Stop the Nav bar item from collapsing

Alright, let's talk about the scenario: The situation is that I have a basic, plain, nav nav-tabs navigation bar with a few elements and a rightmost item (with pull-right) positioned as an <li> element which includes a dropdown. As the window ...

javascriptjqueryhtmlcsstwitter-bootstrap

Choose the list item below

I'm working on a website that includes a select list with images. Here's what I have so far: When I choose an image from the list, it should display below. <?php // Establish database connection $con=mysqli_connect("******","***","*** ...

phpjavascripthtmlweb