I have a page where I want to display content from a website inside my app. I have a parser which in this case grab the element from their site and into mine. But I have this problems, the links serverside are like campaign.aspx?wfege, when a users clicks it, I want to add a http://example.com/ before so the link will result in looking like http://example.com/campaign.aspx?wfege. It this possible in javascript? If so, how? Please look at my fiddle, it's fully working and is an exact copy of my site.
Fiddle: http://jsfiddle.net/4vdck/
Cheers
This can be done in your HTML.
You need to add the base tag with the appropriate href, like this
<html>
<head>
<base href="http://example.com/" target="_blank">
....
....
</head>
<body>
ClickHere <!-- Because of the base tag this href will lead you to http://example.com/campaign.aspx?wfege -->
....
</body>
</html>
Related
I wonder if it's possible to navigate to a web page via link and zoom in to be 150%?
The only thing I could think about is to rewrite the '.click()' function and change the css there such as '-moz-transform', maybe something like this:
<!DOCTYPE html>
<meta charset="utf-8">
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>
<a href="https://www.google.com/search?q=kobe&igu=1" id="myLink" ></a>
</body>
<script>
$('#myLink').click(function() { zoom_page() });
function zoom_page()
{
// DO SOMETHING HERE!!
}
function autoClick() {
document.getElementById('myLink').click()
}
window.addEventListener("load", autoClick);
</script>
</html>
but not sure how exactly to do it.
Anyone can help? Thanks!
Andy
Given your example uses the URL of a well-known public site which you, almost certainly. have no control over: You can't do that.
Any JavaScript you run will apply to the current page and not the next one you navigate to.
If you could run JavaScript on arbitrary third-party websites then there would be a major XSS problem everywhere.
If you had control over the destination page then you could modify it with server-side code or JS embedded in the destination page contingent on data passed from the previous page (e.g. via the URL's query string).
I have a website and I want to use my dropdown menu as a separate code from any links in website.
http://www.stelianpopa.ro/photo/ancar.html
I use the code for my menu in menu.html and I integrated on website based on this example: http://api.jquery.com/load/
The codes are loaded but most of the time the drop menu doesn't work, even if appear to be loaded, it shows only the first line and not the submenu for "photo" and "video"
Any help for that?
Basically wat I want is to have my menu as an independent file and to be loaded on any html on my website as a reference, because when I want to add something in the menu I had to do it on every single html and that's why I want to be standalone, to modify once for every html.
Sorry for my bad english.
If not already, make a html file that includes your menu (dropdown).
Then, on every page that you want to use the menu, include an iframe pointing to the html file you created for your menu.
For example:
Menu.html
<html>
<head></head>
<body>
<!-- code for menu -->
</body>
</html>
Every page you want to use the menu on
<html>
<head>...</head>
<body>
<!-- content -->
<iframe src='path/to/menu.html'>Sorry, but your browser does not support iframe.</iframe>
</body>
</html>
Hope this works for you.
Without templating, you can use javascript to load template onto the page. I would set up a mini project for this to avoid copy-pasting, but the basics are below
In the body where you want the menu:
<div id="my-nav-menu"></div>
script:
document.addEventListener('DOMContentLoaded', function() {
var menu = document.getElementById('my-nav-menu');
menu.innerHTML = 'menu html here';
});
Update
I just noticed the jquery tag, so you can use the following script instead:
$(document).ready(function() {
$('#my-nav-menu').html('menu html here');
});
My website is asp.net.
I have added / to the end of my link, like this:
http://localhost:5022/Registration.aspx/
Why does this not work in CSS?
Use
<base href="base link" />
This will set the base URL of links and images (basically everything). This will fix the links.
Example:
<base href="/" />
I think it is important to point out that to use the base tag it must go in the head of a site...so example below..
<head>
<base href="http://www.whatever.com/images/">
</head>
Using this code, I am trying to get the href attribute of a link and make a new link of that attribute. Why my link does not work, I don't know. It shows something like this:
404 - The page cannot be found
Sorry, we cannot find the page.
It might have been removed, had its name changed, or is temporarily
unavailable.
Please check that the Web site address is spelled correctly.
Or go to our home page, and use the menus to navigate to a specific
section.
Here is my code:
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
text ="";
text +=$("#w3s").attr("href");
document.getElementById("demo").innerHTML="<a href=\'text\'>W3Schools.com</a>";
});
});
</script>
</head>
<body>
<p>W3Schools.com</p>
<button>Show href Value</button>
<p id="demo"></p>
</body>
</html>
If I use:
document.getElementById("demo").innerHTML = text;
It shows http://www.w3schools.com. Why doesn't the link go to this site?
If you're going to use jQuery to traverse and manipulate the DOM, use jQuery. If you're going to use vanilla javascript... do that. Just try not mix them! Makes things easier in the long run. Anyway, you could do something like this to set the href attribute;
$('#demo').attr('href', text);
or
document.getElementById('demo').href = text;
btw this
"<a href=\'text\'>W3Schools.com</a>"
Is totally not how you do string concatenation in javascript. Should be
'W3Schools.com'
I have a website which I host myself. I do not have a static IP address so I have all traffic for my domain forwarded with masking to my DDNS account. The resulting page looks like this...
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>mydomianname.com</title>
</head>
<frameset rows="100%,*" border="0">
<frame src="http://myddns.dyndns.org/mydomainname" frameborder="0" />
<frame frameborder="0" noresize />
</frameset>
</html>
How can I update the URL of the "parent" frame as users navigate within the "child" frame?
UPDATE: Success?
I have tried doing this with javascript but had an issue getting the correct href to my javascript function with out having adverse side effects (having two windows open up, having my main window go to the wrong location, or making it so the back button didn't work right). All I needed was an attribute of my a tag to hold a value that I could use in my javascript, but would do nothing else at all. Adding the attributed value event though it is not a native attribute to the a tag works great.
The a tag...
<a onclick="url_update(this);" value="test/test.html" href="javascript:void(0);">test link</a>
and the javascript function...
function url_update(element){
base_url = 'http://mydomain.com/';
window.parent.location.href = base_url + element.getAttribute('value');
}
the resulting updated URL is...
http://mydomain.com/test/test.html
... and there are none of the previously mentioned side effects.
The only "side effect" that I would like to fix is display of the link in the info bar at the bottom of a browser window. Right now it says javascript:void(0); because that is what is written in my href attribute, but I would like it to show the updated URL when the link is hovered over... any thoughts?
It would be even better if I could scrap all of this javascript and use IIS 7 URL Rewrite 2.0 to do this instead... but I have yet to master the black art of URL rewriting.
javascript:
window.top.location = 'anther url'
--UPDATE to your updated question
use element.getAttribute('value') instead of element.value
--UPDATE #2
Use the href attribute, however, add a return false; to the onclick function:
<a onclick="url_update(this);return false;" value="test/test.html" href="test/test.html">test link</a>
Once you are doing that, you might aswell skip the value attribute and just use the href property, update your url_update function to use element.href instead of element.value
It's hard to tell from your question exactly which frames are doing what, but if The Scrum Meister's solution works for you, than you can easily implement what you want by adding this to each of your A tags.
target="_top"
Your example modified.
test link
You could also do this with jquery...
On the page where all A tags should have target="_top" you can implement the following jquery code on the page and it will dynamically add the target to all links.
<script language="javascript" type="text/javascript">
$(function()
{
$("A").attr("target","_top");
});
</script>
That is assuming that you have normail A tags with the href attribute, you can get rid of the onclick all together, no other javascript is required with the target solution.
First you need to be on the same domain... otherwise for security reasons you can not change it.
Declare and call this function in your child frame
function change(theUrl){
window.parent.reloadContent(theUrl);
}
In your parent have the following function :
function reloadContent(theUrl){
if (theUrl != ""){
document.getElementById("frameID").src= theUrl ;
}
}