|
JavaScript - Close Icon Doesn't Appear
Hi everyone,
I was trying to add a text popup box on my page, and this code helped me but I need to add a close icon (which is an image in my code).. but it doesn't work! :/ here is my code: Code: function show_hide_box(an, width, height, borderStyle) {
if (navigator.userAgent.indexOf("MSIE") != -1) {
var browserIsIE = true;
} else { browserIsIE = false; }
var href = an.href;
var boxdiv = document.getElementById(href);
if (boxdiv != null) {
if (boxdiv.style.display=='none') {
move_box(an, boxdiv);
boxdiv.style.display='block';
} else
boxdiv.style.display='none';
return false;
}
boxdiv = document.createElement('div');
boxdiv.setAttribute('id', href);
boxdiv.style.display = 'block';
boxdiv.style.position = 'absolute';
boxdiv.style.width = width + 'px';
boxdiv.style.height = height + 'px';
boxdiv.style.border = borderStyle;
boxdiv.style.backgroundColor = '#FFF';
var inClosebox = document.createElement("div");
inClosebox.setAttribute('id', 'Close');
inClosebox.style.position = 'absolute';
if (browserIsIE) {
inClosebox.style.left = '-1px';
inClosebox.style.top = '0px';
} else {
inClosebox.style.left = '-15px';
inClosebox.style.top = '-15px';
}
inClosebox.style.visibility = 'hidden';
var inImage2 = document.createElement("img");
inImage2.onclick = function () { this.document.close(); };
inImage2.setAttribute('src', '../../Images/closebox.png');
inImage2.setAttribute('width', '30');
inImage2.setAttribute('height', '30');
inImage2.setAttribute('border', '0');
inImage2.style.cursor = 'pointer';
inClosebox.appendChild(inImage2);
var contents = document.createElement('iframe');
contents.scrolling = 'yes';
contents.frameBorder = '0';
contents.style.width = width + 'px';
contents.style.height = height + 'px';
contents.src = href;
boxdiv.appendChild(contents);
boxdiv.appendChild(inClosebox);
document.body.appendChild(boxdiv);
move_box(an, boxdiv);
return false;
}
can any help me please? Similar Tutorialsbelow code is not working for IE7. function closeWindowFun(e){ winX = navigator.appName=="Microsoft Internet Explorer" ? window.event.clientX : event.screenX; winY =navigator.appName=="Microsoft Internet Explorer" ? window.event.clientY :event.screenY; temp=navigator.appVersion.split("MSIE"); version=parseFloat(temp[1]); alert(version); closeFlg=false; if(version>=7){ if ((window.event.clientY < 0 && (window.event.clientY >-20 || window.event.clientY <-100)) && (window.event.clientX > (document.documentElement.clientWidth - 5) || window.event.clientX < 15) ){ loseFlg=true; } } else{ if(winX<0 && winY<0){ closeFlg=true; } } if(closeFlg){ window.opener.location .reload(); window.close(); } } please give me suggestions Hi! I'm new to this, so please bare with me. My terminology may not be up to par. Here's the deal: - I have a button on my Flash site that opens an HTML page in a popup window. In Flash, I open the new window using Actiosnscript 2.0: Code: on (release) {
getURL("example1.html", "_blank");
}
- Within the popup window are links to other HTML pages. They all open in the same window. I've been using the following to create the links in Dreamweaver: Code: onClick="MM_goToURL('parent','example2.html')"
- On each page, I have a "Return to Main Menu" button that should close the popup window. To do this, I have been using: Code: onClick="window.close()" - The problem is that it works differently in each browser, and I can't even get it to consistently close the window in most browsers: Internet Explorer = popup message appears, asking "Are you sure you want to close this window?" or something similar; window closes after clicking "Yes." Safari = Only closes if I'm on the original HTML page. If I click on any of the other links (note that these all open in the same window), those pages' "Return to Main Menu" buttons cease to work. However, if I keep clicking "Back" until I get to the original page, it closes. Opera = Button actually works for each page. Firefox & Chrome = Does not close the window at all. I looked into it and saw that others have used a window.opener to solve similar issues. But, since my popup window is opened using Flash/AS2, I need to find a way around it. I've tried preceding "window.close()" with "window.opener=null" (i.e. - onClick="window.opener=null; window.close()"), but I don't think I'm doing it right because it still doesn't work. I've also seen others use codes that involve functions and variables, but it is beyond my current coding knowledge to implement this. Like I said, I'm sort of new at this. Any advice would be greatly appreciated. Thank you. - PW I can do php but not javascript very well so asking for help here I have an existing google mapping solution for an online database, but as the database has grown we now need some form of clustering solution this site has the sort of solution I want (although I would like the change the icons to something more apt for our needs) http://google-maps-utility-library-v...d_example.html our current code snippet for the maps is as follows, any help how to add clustering with the number of entries within each cluster shown as a number inside the icon :- Code: echo "<table border=\"0\" width=\"100%\" height=\"800\" id=\"table1\">
<tr>
<td align=\"center\">
<script src=\"http://maps.google.com/maps?file=api&v=2&key=$apikey\" type=\"text/javascript\"></script>
<div id=\"map\" style=\"width: 100%; height: 100%; color:black\"></div ><br />
<div id='stmsg'></div><br />
<div id='streetview' style='width:800px;height:200px'></div>
<script type=\"text/javascript\">
//<![CDATA[
var icon = new GIcon();
icon.image = \"modules/Campsites/icons/marker.png\";
icon.iconSize = new GSize(25, 25);
icon.iconAnchor = new GPoint(9, 20);
icon.infoWindowAnchor = new GPoint(9, 2);
icon.infoShadowAnchor = new GPoint(18, 25);
var map,mm;
var gmarkers=[];
function createMarker(point,html,style)
{
// FF 1.5 fix
html = '<div align=\"left\" style=\"white-space:nowrap;\">' + html + '</div>';
icon.image = 'modules/$module_name/icons/' + style + '.png';
var marker = new GMarker(point, icon);
GEvent.addListener(marker, \"click\", function() {
//map.setCenter(marker.getLatLng());
marker.openInfoWindowHtml(html);
streetview.lat = marker.getLatLng().y;
streetview.lng = marker.getLatLng().x;
streetview.load();
});
return marker;
}
function loadMap()
{
map = new GMap2(document.getElementById(\"map\"),{ size: new GSize(800,600) });
map.disableDoubleClickZoom();
";
// if ( isset($_POST['lat'])&&isset($_POST['lng'])&&isset($_POST['zoom']))
// echo ("map.setCenter(new GLatLng(".$lat.",".$lng."),".$zoom.");");
//else{
if(isset($_SESSION["Xcord"]) && !empty($_SESSION["Xcord"]))
{
$dis=$_SESSION[totaldistance];
$zoom=5;
if(isset($_SESSION["townname"]) || isset($_SESSION["latitude"])){
if($dis<=10)
$zoom=11;
else if($dis<=20)
$zoom=10;
else if($dis<=30)
$zoom=9;
else if($dis<=40)
$zoom=9;
else
$zoom=8;
}
echo ("map.setCenter(new GLatLng(".$_SESSION["Xcord"].",".$_SESSION["Ycord"]."),$zoom);");
echo "streetview.lat='$_SESSION[Xcord]';streetview.lng='$_SESSION[Ycord]';";
}
else
echo ("map.setCenter(new GLatLng(53.69670647530323,-3.8232421875),6);");
//}
if((isset($_SESSION["townname"])||isset($_SESSION["latitude"])) && isset($_SESSION["Xcord"]) && !empty($_SESSION["Xcord"]) )
{
echo ("doDrawCircle(new GLatLng(".$_SESSION["Xcord"].",".$_SESSION["Ycord"]."),$_SESSION[totaldistance]);");
}
echo " mm = new GMarkerManager(map);
var latLng = map.getCenter();
document.typeform.lat.value=latLng.lat();
document.typeform.lng.value=latLng.lng();
document.typeform.zoom.value=map.getZoom();
document.countryform.lat.value=latLng.lat();
document.countryform.lng.value=latLng.lng();
document.countryform.zoom.value=map.getZoom();
//showAddress(\"Newquay\");
map.addControl(new GLargeMapControl());
map.addControl(new GMapTypeControl())
map.addControl(new GScaleControl());
map.addControl(new GOverviewMapControl());
// Hides the info windows when the map is clicked
GEvent.addListener(map, \"dblclick\", function(overlay, latlng) {
if(!overlay)
{
mm.refresh();
map.clearOverlays();
// map.setZoom(9);
drawCircle(latlng,$userbrochureid,'$module_name');
map.addOverlay(streetview.marker);
}
});
GEvent.addListener(map, \"click\", function(overlay, latlng) {
if(!overlay)
{
mm.refresh();
map.clearOverlays();
drawCircle(latlng,$userbrochureid,'$module_name');
streetview.lat = latlng.y;
streetview.lng = latlng.x;
streetview.load();
}
});
// Store the longitude, latitude and zoom when the map is moved
GEvent.addListener(map, \"moveend\", function()
{
var latLng = map.getCenter();
document.typeform.lat.value=latLng.lat();
document.typeform.lng.value=latLng.lng();
document.typeform.zoom.value=map.getZoom();
document.countryform.lat.value=latLng.lat();
document.countryform.lng.value=latLng.lng();
document.countryform.zoom.value=map.getZoom();
}
);
// This is where we add the list of users to the map
";
if ( $row = $db->sql_fetchrow($result) )
{
do
{
if ( $row['XCoord'] == "")
{
// No location
}
else
{
$CampsiteName = $row['CampsiteName'];
$SubmittedBy = $row['SubmittedBy'];
$csid = $row['csid'];
$PhotoLink1 = $row['PhotoLink1'];
if($PhotoLink1!='') {
$userpic = "http://www.oursite.com/modules/$module_name/images/campsites/" . $row['PhotoLink1'];
} else {
$userpic='';
}
if($Type=="BROCHURE") {
$brochuredel="<a href=\"modules.php?name=$module_name&op=BrochureDel&csid=$csid&userbrochureid=$userbrochureid\"><img src=\"modules/$module_name/images/trash.gif\" title=\"Remove from Campsite Brochure\" border=\"0\"></a>";
}
$Town = $row['Town'];
$Colour = $row['Colour'];
$TelephoneNumber = $row['TelephoneNumber'];
$Type = $row['Type'];
$Details = "http://www.oursite.com/modules.php?name=$module_name&op=display_results&csid=$csid";
$XCoord = $row['XCoord'];
$YCoord = $row['YCoord'];
if (!preg_match("/[.]/", $XCoord)) {
$XCoord = stripslashes($row['XCoord']);
list($degrees,$minutes,$seconds) = explode(" ",$XCoord);
$minutesconverted=$minutes*60;
$totalseconds=$minutesconverted+$seconds;
$totalsecondsconverted=$totalseconds/3600;
$totalsecondsrounded = number_format($totalsecondsconverted, 6, ".", ",");
$degrees += 0;
list($rubbish,$totalsecondsrounded) = explode(".",$totalsecondsrounded);
$DecimalXCoord="$degrees" . "." . "$totalsecondsrounded";
} else {
$DecimalXCoord = $XCoord;
}
if (!preg_match("/[.]/", $YCoord)) {
$YCoord = stripslashes($row['YCoord']);
list($degrees,$minutes,$seconds) = explode(" ",$YCoord);
$minutesconverted=$minutes*60;
$totalseconds=$minutesconverted+$seconds;
$totalsecondsconverted=$totalseconds/3600;
$totalsecondsrounded = number_format($totalsecondsconverted, 6, ".", ",");
$degrees += 0;
list($rubbish,$totalsecondsrounded) = explode(".",$totalsecondsrounded);
$DecimalYCoord="$degrees" . "." . "$totalsecondsrounded";
} else {
$DecimalYCoord = $YCoord;
}
$userlat = $DecimalXCoord;
$userlong = $DecimalYCoord;
// Remove bad chars from the name and location
$CampsiteName = htmlspecialchars($CampsiteName, ENT_QUOTES);
$Town = htmlspecialchars($Town, ENT_QUOTES);
$SubmittedBy = htmlspecialchars($SubmittedBy, ENT_QUOTES);
$TelephoneNumber = htmlspecialchars($TelephoneNumber, ENT_QUOTES);
// Setup the marker colour
$iconstyle="marker";
if($Type == "CS") {
$iconstyle = "cs";
} elseif($Type=="CL") {
$iconstyle="cl";
} elseif($Type=="CCC") {
$iconstyle="ccc";
} elseif($Type=="CC") {
$iconstyle="cc";
} elseif($Type=="Wild Camping Spot") {
$iconstyle="wild";
} elseif($Type=="Parking Place") {
$iconstyle="pp";
} elseif($Type=="Independent") {
$iconstyle="ind";
} elseif($Type=="Aire") {
$iconstyle="aire";
} elseif($Type=="Aree Di Sosta") {
$iconstyle="aree";
} elseif($Type=="Stellplatz") {
$iconstyle="stellplatz";
} elseif($Type=="Municipal") {
$iconstyle="mun";
} elseif($Type=="FP") {
$iconstyle="fp";
}elseif($Type=="CCheq") {
$iconstyle="cheq";
}elseif($Type=="Pub Stopover") {
$iconstyle="pubstop";
}
if ($username==$SubmittedBy) {
$modlink = "<a href=\"modules.php?name=$module_name&op=modify&csid=$csid\"><img src=modules/Campsites/images/book_edit.gif align=\"absmiddle\" border=0 title=\"Edit $CampsiteName\"></a>";
} elseif(is_deputyadmin($user)) {
$modlink = "<a href=\"modules.php?name=$module_name&op=modify&csid=$csid\"><img src=modules/Campsites/images/book_edit.gif align=\"absmiddle\" border=0 title=\"Edit $CampsiteName\"></a>";
} else {
$modlink='';
}
if($userpic!='') {
$markertext = "<table border=\"0\" width=\"300\" cellspacing=\"0\" cellpadding=\"0\" id=\"mapinfo\"><tr><td width=\"80\" valign=\"top\"><img width=\"80\" border=\"0\" src=\"$userpic\" align=\"left\"></td>";
$markertext.= "<td>Type: <b>$Type</b><br>";
$markertext.= "Name:<b>$CampsiteName</b><br>";
$markertext.= "Town: <b>$Town</b><br>";
$markertext.= "Phone:<b>$TelephoneNumber</b><br>";
$markertext.= "Submitted By: <b>$SubmittedBy</b><br>";
$markertext.= "Full Details: <b><a rel="nofollow" target=blank.html href=$Details>Click HERE</a><br>";
$markertext.= "$modlink <a href=\"modules.php?name=$module_name&op=BrochureAdd&csid=$csid&userbrochureid=$userbrochureid\"><img src=\"modules/$module_name/images/add_to_brochure.gif\" title=\"Add to Virtual Campsite Brochure\" border=\"0\"></a> $brochuredel <a href=\"javascript:void(0)\" onclick=\"route.showForm(\'$DecimalXCoord,$DecimalYCoord\')\">Get Directions</a></td></tr></table>";
} else {
$markertext = "<table border=\"0\" width=\"300\" cellspacing=\"0\" cellpadding=\"0\" id=\"mapinfo\">";
$markertext.= "<tr><td>Type: <b>$Type</b>";
$markertext.= "<br>Name:<b>$CampsiteName</b>";
$markertext.= "<br>Town: <b>$Town</b>";
$markertext.= "<br>Phone: <b>$TelephoneNumber</b>";
$markertext.= "<br>Submitted By: <b>$SubmittedBy</b>";
$markertext.= "<br>Full Details: <b><a href=$Details>Click HERE</a><br>$modlink <a href=\"modules.php?name=$module_name&op=BrochureAdd&csid=$csid&userbrochureid=$userbrochureid\"><img src=\"modules/$module_name/images/add_to_brochure.gif\" title=\"Add to Virtual Campsite Brochure\" border=\"0\"></a> $brochuredel <a href=\"javascript:void(0)\" onclick=\"route.showForm(\'$DecimalXCoord,$DecimalYCoord\')\">Get Directions</a></td></tr></table>";
}
echo "var point = new GPoint($userlong, $userlat);";
echo "var marker = createMarker(point, '$markertext', '$iconstyle' , 'tooltip');";
echo "map.addOverlay(marker);";
}
}
while ( $row = $db->sql_fetchrow($result) );
echo "mm.addMarkers(gmarkers,1,17);";
}
echo "
streetview.load();
}
// arrange for our onload handler to 'listen' for onload events
if (window.attachEvent)
{
window.attachEvent(\"onload\", function()
{
loadMap(); // Internet Explorer
}
);
}
else
{
window.addEventListener(\"load\", function()
{
loadMap(); // Firefox and standard browsers
}, false);
}
function showAddress(address)
{
var geocoder = new GClientGeocoder();
geocoder.getLatLng(address,
function(point)
{
if (!point)
{
alert(address + \" not found\");
}
else
{
map.setCenter(point, 13);
var marker = new GMarker(point);
map.addOverlay(marker);
marker.openInfoWindowHtml(address);
}
}
);
}
//]]>
</script>
</td>
</tr>
</table>
";
?>
We got a google maps with a bunch of pins. Each pin is setup to use our blue custom icon image. I'm trying to make it so that when you click on a pin, that particular pin changes to a green version of the icon, and all the reset stay blue. If the user clicks another pin, it turns green and the previous goes back to blue. Basicly only the clicked active pin should be green. Code: google.maps.event.addListener(markers[indx], 'click', function() {
this.setIcon("/images/greenmarker.png");
});
Here is my code so far that will change the clicked pin into a green version. My problem is all attempts to change all pins back to blue prior to changing this clicked pin to green fails bad. Anyone know how to do this or point me in the right direction? Hi I have the following code to insert a google map of the UK into my page with some markers on it. This is fine except I want to change the icon to a simple flat spot. I'm sure this is easy and I have actually managed this before when there was only one marker on the map. I can't figure out how to do it on this example though. Any help would be appreciated. Code: <!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>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>map test</title>
<script src="http://maps.google.com/maps?file=api&v=2&sensor=false&key=ABQIAAAAQJTCOfFBzEZfb0xYTu1h_BR0_9owy9VLLEJCKI_ZedHr-0NdXxQd9Q8sR1hC7s4PNGNVmIaTUQvspA" type="text/javascript"></script>
</head>
<body>
<div id="map" style="width: 606px; height: 750px"></div>
<script type="text/javascript">
//<![CDATA[
if (GBrowserIsCompatible()) {
function createMarker(point,html) {
var marker = new GMarker(point);
GEvent.addListener(marker, "click", function() {
marker.openInfoWindowHtml(html);
});
return marker;
}
var map = new GMap2(document.getElementById("map"));
map.setMapType(G_HYBRID_MAP);
map.setCenter(new GLatLng(54.57951, -4.41387), 6);
map.addControl(new GHierarchicalMapTypeControl());
map.addControl(new GSmallMapControl());
var point = new GLatLng(51.34699,-2.25413);
var marker = createMarker(point,'blah blah blah')
map.addOverlay(marker);
var point = new GLatLng(53.05912,-2.69214);
var marker = createMarker(point,'blah blah blah')
map.addOverlay(marker);
var point = new GLatLng(54.60522,-2.00281);
var marker = createMarker(point,'blah blah blah')
map.addOverlay(marker);
}
else {
alert("Sorry, the Google Maps API is not compatible with this browser");
}
//]]>
</script>
</body>
</html>
Hello, I have a tool in my app where a user can perform a search, and it will use AJAX to deliver the results into a small box, in JSON format. When a user submits a search, a spinning gif will appear as the query is running. A javascript function is then meant to remove the gif and display the results once ready. In IE, however, this fails to happen, and the gif is locked in place, preventing the results from being displayed. I have no experience with javascript and am a bit unsure what to do. Tried to use IE's script debugger, but got totally confused. The script is much longer than this, but I think this is the problematic area: Code: 'beforeSend': function(r) {
ul.find('li').remove();
ul.html('<li class="center"><img src="/images/ajax-loader.gif" /></li>');
},
'success': function(r) {
ul.find('li').remove();
h = ''
$(r).each(function(k,r0){
h = h + '<li data-id="'+r0.value+'" data-icon_url="'+r0.icon_url+'">'+r0.label+'</li>';
});
For some reason, in IE only, it will clear the contents and display the gif upon submitting a search. But then it won't clear the gif and display the results. Any ideas? I would be so appreciative. Thank you. Greg I am a beginner with coding and have no idea what I'm doing. Hopefully I'm posting this on the right forum. I have just registered a domain for my business and am maintaining my webpage through tumblr. I have stumbled around into finding a code that will allow me to hide/collapse certain content. The problem is that I want it to become an icon that changes from a "plus" to a "minus" sign, or any one character to another, as opposed to having it be the title that gets clicked on in order to be expanded. One major issue I'm having revolves around content expanding where a link is displayed. I am coding this on the "links" section of my page, which is links to other businesses and webpages I support. So, for example, I'll have a link to a business, and the hidden content will be something I have to say about it, that the person viewing can chose to read by clicking to expand content. I want it hidden by default to take up less space. This is the code I put into my head section: <!-- COLLAPSIBLE TEXT --> <!-- This goes into the HEAD of the html file --> <script language="JavaScript" type="text/javascript"> <!-- Copyright 2005, Sandeep Gangadharan --> <!-- For more free scripts go to http://www.sivamdesign.com/scripts/ --> <!-- if (document.getElementById) { document.writeln('<style type="text/css"><!--') document.writeln('.texter {display:none} @media print {.texter {display:block;}}') document.writeln('//--></style>') } function openClose(theID) { if (document.getElementById(theID).style.display == "block") { document.getElementById(theID).style.display = "none" } else { document.getElementById(theID).style.display = "block" } } // --> </script> And this is what the html looks like, which I've placed within a table (the list of businesses/pages I support or recommend): <td width=[]> <h2><u>[list name]</u></h2> <p> <a href="http://[link to business].com">[name]</a> <br> <div onClick="openClose('a3')" style="cursor:hand; cursorointer">∇</div> <div id="a1" class="texter"><font style="font-size:90%" color="maroon"> [hidden content]</font></p></div> Is is possible for me to place some kind of code where I have the ∇ that will switch between two icons when shown/hidden? Do I have to use a completely different script? Also, is it possible to keep both a link and a toggle icon on the same line without a break, yet have them lead to different places? Maybe this is more difficult than I think it should be, but I really cant find a good script on the internet for this. Any help would be appreciated. Thanks. I am asking a pretty simple question, but you got to start learning somewhere, you know! Anyway, I have implemented a script that resizes images into small thumbs on the left side of a page and shows the full size image on the right when the user click on a thumb. It works well. However, I have a possible 10 thumbs on theleft and my database that feeds this does not always have 10 images. Since I re-use the page for mutiple listings, I need to find a way to disable the broken image link for listings that don't have 10 thumbs. I have attached a picture of what it looks like. Here is the script: Code: #jgal { list-style: none; width: 200px; }
#jgal li { opacity: .5; float:left; display: block; height:60px; width:60px; overflow:hidden; background-position: 50% 50%; cursor: pointer; border: 3px solid #fff; outline: 1px solid #ddd; margin-right: 14px; margin-bottom: 14px; }
#jgal li img { height:60px; width:auto; }
#jgal li.active img { display: block; }
#jgal li.active, #jgal li:hover { outline-color: #bbb; opacity: .99 /* safari bug */ }
/* styling without javascript */
#gallery { list-style: none; display: block; }
#gallery li { float: left; margin: 0 10px 10px 0; }
</style>
<!--[if lt IE 8]>
<style media="screen,projection" type="text/css">
#jgal li { filter: alpha(opacity=50); }
#jgal li.active, #jgal li:hover { filter: alpha(opacity=100); }
</style>
<![endif]-->
<script type="text/javascript">document.write("<style type='text/css'> #gallery { display: none; } </style>");</script>
<!--[if lt IE 6]><style media="screen,projection" type="text/css">#gallery { display: block; }</style><![endif]-->
<script type="text/javascript">
var gal = {
init : function() {
if (!document.getElementById || !document.createElement || !document.appendChild) return false;
if (document.getElementById('gallery')) document.getElementById('gallery').id = 'jgal';
var li = document.getElementById('jgal').getElementsByTagName('li');
enlargedImg = document.createElement('img');
document.getElementById('jgal').parentNode.insertBefore(enlargedImg,document.getElementById('jgal').nextSibling);
enlargedImg.src = li[0].getElementsByTagName('img')[0].src;
li[0].className = 'active';
for (i=0; i<li.length; i++) {
li[i].style.backgroundImage = 'url(' + li[i].getElementsByTagName('img')[0].src + ')';
li[i].style.backgroundRepeat = 'no-repeat';
li[i].title = li[i].getElementsByTagName('img')[0].alt;
gal.addEvent(li[i],'click',function() {
var im = document.getElementById('jgal').getElementsByTagName('li');
for (j=0; j<im.length; j++) {
im[j].className = '';
}
this.className = 'active';
enlargedImg.src = this.getElementsByTagName('img')[0].src;
});
}
},
addEvent : function(obj, type, fn) {
if (obj.addEventListener) {
obj.addEventListener(type, fn, false);
}
else if (obj.attachEvent) {
obj["e"+type+fn] = fn;
obj[type+fn] = function() { obj["e"+type+fn]( window.event ); }
obj.attachEvent("on"+type, obj[type+fn]);
}
}
}
gal.addEvent(window,'load', function() {
gal.init();
});
And then my list basically looks like this: Code: <ul id="gallery">
<li><img src="images/details/<?php echo $row_WADAitems['ItemThumb5']; ?>" alt="<?php echo $row_WADAitems['ItemDesc5']; ?>"></li>
<li><img src="images/details/<?php echo $row_WADAitems['ItemThumb6']; ?>" alt="<?php echo $row_WADAitems['ItemDesc6']; ?>"></li>
<li><img src="images/details/<?php echo $row_WADAitems['ItemThumb7']; ?>" alt="<?php echo $row_WADAitems['ItemDesc7']; ?>"></li>
<li><img src="images/details/<?php echo $row_WADAitems['ItemThumb8']; ?>" alt="<?php echo $row_WADAitems['ItemDesc8']; ?>"></li>
<li><img src="images/details/<?php echo $row_WADAitems['ItemThumb9']; ?>" alt="<?php echo $row_WADAitems['ItemDesc9']; ?>"></li>
<li><img src="images/details/<?php echo $row_WADAitems['ItemThumb10']; ?>" alt="<?php echo $row_WADAitems['ItemDesc10']; ?>"></li>
<li><img src="images/details/<?php echo $row_WADAitems['ItemThumb11']; ?>" alt="<?php echo $row_WADAitems['ItemDesc11']; ?>"></li>
<li><img src="images/details/<?php echo $row_WADAitems['ItemThumb12']; ?>" alt="<?php echo $row_WADAitems['ItemDesc12']; ?>"></li>
<li><img src="images/details/<?php echo $row_WADAitems['ItemThumb13']; ?>" alt="<?php echo $row_WADAitems['ItemDesc13']; ?>"></li>
<li><img src="images/details/<?php echo $row_WADAitems['ItemThumb14']; ?>" alt="<?php echo $row_WADAitems['ItemDesc14']; ?>"></li>
</ul>
So as you can see, if I don't have an image in the database that it pulls from, I get that icon for a broken image link. How can I remove that icon so it doesn't show the no image icon? Many thanks! I wish to add a help icon to variousd parts of my pages that places an overlay text box for the help that that help icon relates to. maybe a call like help(datefield) or help(somethingelse) then the script that shows the help text shows the text that relates to the string passed. can someone please provide information on how i can do this. Edit2:: This is what I got to work. Code: <INPUT class=touch type=button value='UP' onMouseDown="up=true;" onMouseUp="up=false;"> <INPUT class=touch type=button value='DOWN' onMouseDown="down=true;" onMouseUp="down=false;"> Then added a check to see if (up==true) {move up code} else if (down==true) {move down code} etc Edit:: Basically Code: <INPUT class=touch type=button value='38' onMouseDown="movingUP();"> Then in JS Code: function movingUP(){
window.event.keyCode = 38;
}
But what do I put in movingUP() to send keyCode 38 when while the button is being clicked????????????????????? Trying to add 8 icons of W,A,S,D, LEFT, RIGHT, UP, DOWN which upon click/touch will input the relative command to the screen canvas for mobiles that don't have a keyboard. They aren't clicking on the canvas. I need some buttons/icons/images outside the canvas probably in a div, that send input events as an alternative to a keyboard...Something that can be clicked and held down to repeatedly spam that key to walk in that direction. I have script to click icons from a keyboard and output the clicked key to a text field, but I don't know how to tie it into my keyboard listener in my game.. My game code uses: Code: // Handle keyboard controls
var keysDown = {};
addEventListener("keydown", function (e) {
keysDown[e.keyCode] = true;
}, false);
addEventListener("keyup", function (e) {
delete keysDown[e.keyCode];
}, false);
Then elsewhere I can trigger events when keysDown contains the number of a key that triggers an item like: Code: if (38 in keysDown && hero.y > 0 ) { // Player holding UP key
//walk north code here
}
Is there a simple way to click on a button and send the "UP" keyCode to the entire screen? Particularly the canvas element......Or get it into my keysDown[e.keyCode]; I found this: Quote: function addKey(cKey) { d = document.forms["foo"].elements["bar"]; d.value = (cKey.value=='backspace') ? d.value.slice(0,-1) : d.value+cKey.value; } //elsewhere in html body <INPUT class=touch type=button value=w onClick="addKey(this)"> which will send 'w' when clicked, and I tried to send '38' instead but it only sends it to 1 element and not the entire screen....so it shows 38 in a text box each time I click it but it doesn't actually send 38 to keys being pressed. Is there a simple way to do this? I wanted to add a fire button and others I figured I could just put an image with an event but can't figure it out.... Hello all, Essentially what I am trying to get without much success on the issue is this: I want an icon in my template that, when you click on that certain icon (image), a drop down menu appears. You know when you click the file option in your browser's toolbar, and a drop down menu appears? It can be just like that, but instead of save as and open, links will be there to places within our intranet opened in a new window. This has to work for IEX 7+ because that's all our company decides to use. I tried to submit a chang erequest for them to move to a better CSS/Javascript supportive browser such as Opera, Firefox, Google Chrome... but they're way too fixed on IEX for some odd reason. I am obliged for any help on this. *edit* colors dont matter. It can be the default colors used in a basic drop down menu. I figure javascript would have more options though. ok, so i got some help on here to modify some java that resides in a server-side program that is limited in scope of modification, but i was able to find the code that i need to modify to perform the behavior i need. the code below works great at making sure the user entry data is formatted correctly, but fails on 2 critical points: 1) it allows a blank entry (needs to give similar error message as when formatted incorrectly - see code) 2) it allows any formatting if a combination of alpha and numeric characters are used (needs to give error message if ANY alpha characters are used). THANKS so much in advance. Code: if( ! Form1.elements['EIF2'].disabled )
var n=Form1.elements['EIF2'].value.match(/\d/g).join('');
Form1.elements['EIF2'].value=
[n.substring(0,4),n.substring(4,9),n.substring(9)].join('-');
{
var re = /^\d{4}\-?\d{5}\-?\d{6}$/
if ( ! re.test( Form1.elements['EIF2'].value ) )
{
alert( 'Lawson # must be 15 digits\r(Example: 1234-12345-123456)' );
return false;
}
}
how to close a tab in html or javascript
Hi! I have a problem with the function close(); The window does open but then it immediately closes by itself. I didn't even get to see the content and of course I didn't even click on the button "close the window!" I want to be able to see the content of the page and when I click on the button, it will close the window. Thank you in advance for your help! Code: var window;
function newWindow(){
window=window.open("", "Results", "width=400, height=250");
window.document.write("<body><table>");
window.document.write("<h1 style='border-bottom-style: dotted; border-bottom-width: 1px;font: italic 16pt Times New Roman, sans-serif; color: navy;'>Survey's Results</h1>");
for(var i=0; i<tabVotes.length; i++){
window.document.writeln("<tr>");
window.document.writeln("<td style='text-align: center'>" + tabPeople[i] + "</td>");
window.document.writeln("<td style='text-align: center'>" + tabVotes[i] + " votes </td>");
window.document.writeln("</tr>");
}
window.document.writeln("</table>");
window.document.writeln("<input name='Close' type='button' value='Close the window' />");
window.document.getElementById('Close').onclick = window.close();
window.document.writeln("<br /><br />Thank you!");
window.document.writeln("</body>");
}
this is quite embarrasing as i've done it before, but oh well... trying to close a window that is opened with a built-in dreamweaver function called MM_openBrWindow(). trying to use this code: PHP Code: if ($OutsideVisitors == "false") { echo '<center><strong><em><font size="4">THERE HAVE BEEN NO VISITORS TO THE WEBSITE TODAY... </font></em></strong><br><br><input name="closeme" type="button" id="closeme" value="Close Window" onclick="Window.Close()"; /></center>'; } i have also tried: PHP Code: onclick=javascript:Window.Close() it's just not behaving for me. any hints anyone? thanks a bunch! (the BrWindow() function in DW does open a popup window, so I think the js close() should work. if i remember right, a popup window is a prereq for that function to even work...) Within my Flex application I write stuff to the browser via a javascript document write. Is there a command to send to indicate I want to close that stream? When I send the command the rotating indicator keeps running indicating the browser is still expecting some stuff. If I click the stop button on the browser it stops spinning and the stuff I sent (an xml stream) becomes available. As this is an automated process, there is no person to hit the stop button. I have this script to close a div when I click outside of it. It works in Firefox but in IE7 i get an error: 'divid' is undefined. mydiv is the div I want to close and clickclick is the link that makes the div appear. Code: <script type="text/javascript">
function monitorClick(e){
var evt = (e)?e:event;
var theElem = (evt.srcElement)?evt.srcElement:evt.target;
while(theElem!=null){
if(theElem.id == "mydiv" || theElem.id == "clickclick" && document.getElementById(divid).style.display == 'none') {
document.getElementById('mydiv').style.display = 'block';
return true;
}
theElem = theElem.offsetParent;
}
document.getElementById('mydiv').style.display = 'none';
return true;
}
document.onclick = monitorClick;
</script>
What should I change to make it work in IE7? Have been trying to make a button to close a web page but every time i try to get it validated "strict" it fails. I have used the following code. Code: <form action=""> <input type="button" value="Close Window" onclick="window.close()"> </form> Would really appreciate any help. Thanks I am having a heck of a time closing this popup window when i logoff the site. i open it by Code:
shoutwindow = window.open("<?=$MY_LINK_ROOT?>/shoutbox/minichat.php", "shoutwindow", "location=0,status=0,scrollbars=0,menubar=0,resizable=0 width=300,height=310");
when i click logoff the site i want the popup to close also here is the logoff php Code:
session_start();
//only for testing will remove this
if(!shoutwindow.closed)
{
echo "window open";
self.close();
//shoutwindow.close (); // also tried both these didnt work
// window.close();
}
else
{
echo "Window already closed";
}
mysql_close($link);
unset($_SESSION['Sess_UserId']);
// Unset all of the session variables.
session_unset();
// Finally, destroy the session.
session_destroy();
echo "<script> location.href='$MY_LINK_ROOT'</script>";
exit;
?>
what am i missing here lol ? thanks UPDATE: i just had an idea, can i mix a href and an onClick together so that both are executed like this (i never tried it before) Code: the reason i use self.close is because i heard that it always closes the child not the parent. <a href="logoff.php" onClick="self.close()" return:true;>Log Off</a> the return true will make it execute the href as well right? I am trying to execute a simple window.close function to be used in IE8 and IE9, and window.close() doesn't seem to be working. Are there any known fixes?
|
|||||||