I tried to switch between 2 virtual tour images and each time when I switch, it will move to a position I want. But When I call moveTo() following newPanoFromList(), it will do the startAutoPan(), and not move to the position I want.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>PTViewer</title>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=iso-8859-1" />
<SCRIPT language="javascript">
function moveToZero() {
document.ptviewer.newPanoFromList(0);
document.ptviewer.moveTo(143,0,53,200);
}
function moveToOne() {
document.ptviewer.newPanoFromList(1);
document.ptviewer.moveTo(-131,0,42,200);
}
</SCRIPT>
</head>
<body>
<APPLET name="ptviewer" archive=ptviewer.jar code=ptviewer.class width=640 height=480 mayscript=true>
<PARAM name=pano0 value="{file=virtual2.jpg}">
<PARAM name=pano1 value="{file=virtual3.jpg}">
<PARAM name=file value="ptviewer:0">
</APPLET>
<input type="button" value="pano0" onclick="moveToZero()" />
<input type="button" value="pano1" onclick="moveToOne()" />
</body>
</html>
Try adding stopAutoPan():
<SCRIPT language="javascript">
function moveToZero() {
document.ptviewer.newPanoFromList(0);
document.ptviewer.moveTo(143,0,53,200);
}
function moveToOne() {
document.ptviewer.newPanoFromList(1);
document.ptviewer.stopAutoPan();
document.ptviewer.moveTo(-131,0,42,200);
}
</SCRIPT>
Related
Although this page seems to load file, I get an error from NU HTML checker. Not sure how to clear the error, because it seems everything in the body would of course be a child of the XHTML body element.
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>How About Them Apples?</title>
<meta charset="utf-8" />
<link href="apples.css" rel="stylesheet" type="text/css" />
</head>
<body>
<apples xmlns:apls="https://www.dole.com/en/products/apples">
<apls:apple>
<apls:name>Red Delicious</apls:name>
<apls:color>Red</apls:color>
</apls:apple>
<apls:apple>
<apls:name>Golden Delicious</apls:name>
<apls:color>Yellow</apls:color>
</apls:apple>
</apples>
</body>
</html>
I have an input field which currently looks like this:
I would prefer the value to be hidden like this:
Here is the kicker, I know that giving the field a type=password will do this, but unfortunately the software I am using brings over 2 password fields in this case. So, I am left with a standard text input to create the effect.
My hope is that there is some CSS styling that I can do to the field id in order to hide the input information. Thanks for you attention to this issue.
You could just use:
input { -webkit-text-security: disc; /* Default */ }
as described here
Here is also a dirty hack for other browsers
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="txt/javascript">
<script type="text/javascript">
function replaceT(obj){
var newO=document.createElement('input');
newO.setAttribute('type','password');
newO.setAttribute('name',obj.getAttribute('name'));
obj.parentNode.replaceChild(newO,obj);
newO.focus();
}
</script>
</head>
<body>
<form>
<input type="text" name="password" onfocus="replaceT(this)">
</form>
</body>
</html>
I can't set the font-size of a text input from the style sheet. However, it works fine by setting the style attribute.
This works:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text-htmlcharset=utf-; 8" />
<title>Test</title>
<style type="text/css">
#about {
}
</style>
</head>
<body>
<input id="about" type="input" value="anything" style="font-size:21pt;" />
</body>
</html>
This does not work (font-size is ignored):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text-htmlcharset=utf-; 8" />
<title>Test</title>
<style type="text/css">
#about {
font-size:21pt;
}
</style>
</head>
<body>
<input id="about" type="input" value="anything" />
</body>
</html>
What am I missing? Surely, you're not expected to use inline style for all text inputs? That seems pretty tacky and redundant in some cases. Thanks a bunch!
Change <style type="text/javascript"> to <style type="text/css">
You are confusing the browser because it is looking for JavaScript code, but you are feeding it CSS. <script> tags should be used for javascript, and <style> tags for CSS.
Your style block has a type of text/javascript. Remove that and it'll work fine.
Hi everyone I am a new to jQuery. While learning I am following this link:
http://api.jquery.com/browser/. When I am trying to do this example in VS 2010 I'm not getting the exact output. But when I was copying the code which is in this link I was getting the correct output. Please could any one help me?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<base href="http://docs.jquery.com" />
<title>index(subject) function</title>
<style type="text/css">
.div_style
{
background-color: Aqua;
font-family: Verdana;
font-size: small;
}
</style>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.1.js" />
<script type="text/javascript">
$(document).ready(function () {
$("div.div_style").click(function () {
//This is the DOM element clicked
var index = $("div").index(this);
$("span").text("That was div index #" + index);
});
});
</script>
</head>
<body>
<span></span>
<br />
<div class="div_style ">
First Div
</div>
<br />
<div class="div_style ">
Second Div
</div>
<br />
<div class="div_style ">
Third Div
</div>
<br />
</body>
</html>
You can't use self closing tags for <script>. You must end with a </script>:
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.1.js"></script>
I tried with the following but it doesn't work
var txtlat=document.getElementById('TextBox1').value=GMap1.getCenter().lat();
var txtlong=document.getElementById('TextBox2').value=GMap1.getCenter().lng();
It gives a JavaScript error as "Object doesn't support this property or method".
How can i do this????
I really need help...
Thank you!
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication5._Default" %>
<%# Register assembly="GMaps" namespace="Subgurim.Controles" tagprefix="cc1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<cc1:GMap ID="GMap1" runat="server"
Key="ABQIAAAAs98ZVKM_IHFkRP_EavW_DhT2yXp_ZAY8_ufC3CFXhHIE1NvwkxQGoS16N7wYnBPhgtjTxMaUVN58kA" />
<br />
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<br />
<br />
<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
</div>
<script type="text/javascript">
var txtlat=document.getElementById('TextBox1').value=GMap1.getCenter().lat();
var txtlong=document.getElementById('TextBox2').value=GMap1.getCenter().lng();
</script>
</form>
</body>
</html>
2nd UPDATE: Further to the updated question, you also have another problem with the server-side textbox controls. They cannot be referenced from JavaScript using document.getElementById() as you are doing.
You may either use normal HTML controls: <input type="text" id="textbox1" /> or else you would have to use something like document.getElementById('<%= TextBox1.ClientID %>') to reference the textbox from JavaScript.
1st UPDATE: Further to the comments, the examples below have been updated to return the lat/lng of where the mouse is clicked.
You may want to check out the following examples, which have been tested to work correctly:
Using the v3 API:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<title>Google Maps getCenter()</title>
<script src="http://maps.google.com/maps/api/js?sensor=false"
type="text/javascript"></script>
</head>
<body>
<div id="map" style="width: 500px; height: 400px;"></div>
<input type="text" id="textbox1" />
<input type="text" id="textbox2" />
<script type="text/javascript">
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 2,
center: new google.maps.LatLng(35.55, -25.75),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
google.maps.event.addListener(map, 'click', function(event) {
if (event.latLng) {
document.getElementById('textbox1').value = event.latLng.lat();
document.getElementById('textbox2').value = event.latLng.lng();
}
});
</script>
</body>
</html>
Using the v2 API:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Google Maps getCenter()</title>
<script src="http://maps.google.com/maps?file=api&v=2&sensor=false"
type="text/javascript"></script>
</head>
<body onunload="GUnload()">
<div id="map" style="width: 500px; height: 400px;"></div>
<input type="text" id="textbox1" />
<input type="text" id="textbox2" />
<script type="text/javascript">
var map = new GMap2(document.getElementById("map"));
var centerPoint = new GLatLng(35.55, -25.75);
map.setCenter(centerPoint, 2);
GEvent.addListener(map,"click", function(overlay, latlng) {
if (latlng) {
document.getElementById('textbox1').value = latlng.lat();
document.getElementById('textbox2').value = latlng.lng();
}
});
</script>
</body>
</html>
Screenshot from the above examples:
Did you confirm the value returned from getCenter is not null? It should be a LatLng object, but maybe it's returning null... are you sure the center has been set yet? Also, what object type is GMap1? How do you create that object?
I found the answer forgot to mention here so the answer was very simple
Msg1 and Msg2 are DIV tags
protected string Gmap1_Click(object s, Subgurim.Controles.GAjaxServerEventArgs e)
{
return "document.getElementById('Msg1').innerHTML="
+ e.point.lat.ToString() + ";" + "document.getElementById('Msg2').innerHTML="
+ e.point.lng.ToString();
}