|
JavaScript - Close Icon Is Not Working For Ie7
below 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 Similar TutorialsHi 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? My code works but when I put an image in there my code doesn't work anymore. Quote: <html> <head> <style type="text/css"> .planType{display:none; width:600px} </style> <script type="text/javascript"> <!-- function planTypeOpen(planID) { document.getElementById('info_' + planID).style.display = "block"; document.getElementById('title_' + planID).innerHTML="<a href=\"javascriptlanTypeClose('" + planID + "');\">Check this out" + "</a>"; } function planTypeClose(planID) { document.getElementById('info_' + planID).style.display = "none"; document.getElementById('title_' + planID).innerHTML="<a href=\"javascriptlanTypeOpen('" + planID + "');\">Check this out" + "</a>"; } //--> </script> </head> <body> <div id="title_1"><a href="javascriptlanTypeOpen('1');">Check this out</a></div> <div id="info_1" class="planType"> You can't see me...<br> Or Can you?? </div> </body> </html> any comments would be greatly appreciated. Hi guys, I have read that the window.close won't work unless the window was opened through window.open. Eventhough I have the window opening through window.open method the window.close simply wont close the window. Below is my code. I appreciate you help as I am desperate to finish my project and this is the only thing between me and the closed project. I have this in the <head> in the parent window. Code: <script language="javascript">
function MM_openBrWindow(theURL,winName,features){
var left = (screen.width/2)-(800/2);
var top = (screen.height/2)-(560/2);
features = features + ",left=" + left;
window.open(theURL,winName,features);
}
</script>
the left and top is to center the window which is working. Then I have the below code in my button which is to open the window. Code: <input type="button" value="E-MAIL" onClick="MM_openBrWindow('email.php?camp_id=<?php echo $encrypted; ?>','','width=860,height=600'); return false"/>
The $encrypted is created beforehand and the window gets opened as well. Now in the popup window... Up on submitting a form, I need the popup to close after saying 'email has been sent'. this is the code for calling the fuction Code: echo "<script language='javascript'>success();</script>"; I get the alert too. Code: function success(){
alert('E-Mail Sent Successfully');
window.close();
}
I even get the alert mentioning "E-Mail Sent Successfully". But simply the window is not closed. Can you guys please shed me some light on this.... Your help is greatly appreciated Ohh and by the way I'm running FF8. Cheers E I'm implementing that stupid Cookie Law thing here in the UK, but I can't get the popup to close on click in IE. Every other browser is working fine. Any one know the fix? Code: <style type="text/css">
<!--
#eucookielaw { display:none }
#note {
position: fixed;
z-index: 101;
bottom: 0;
left: 0;
right: 0;
background: #98FB98;
text-align: center;
vertical-align: middle;
color: #2C2C2C;
line-height: 2.5;
overflow: hidden;
-webkit-box-shadow: 0 0 5px black;
-moz-box-shadow: 0 0 5px black;
box-shadow: 0 0 5px black;
}
#note a {
color: #2C2C2C;
}
#note img {
vertical-align: middle;
}
#close {
cursor: pointer;
}
@-webkit-keyframes slideDown {
0%, 100% { -webkit-transform: translateY(-50px); }
10%, 90% { -webkit-transform: translateY(0px); }
}
@-moz-keyframes slideDown {
0%, 100% { -moz-transform: translateY(-50px); }
10%, 90% { -moz-transform: translateY(0px); }
}
.cssanimations.csstransforms #note {
-webkit-transform: translateY(-50px);
-webkit-animation: slideDown 2.5s 1.0s 1 ease forwards;
-moz-transform: translateY(-50px);
-moz-animation: slideDown 2.5s 1.0s 1 ease forwards;
}
.cssanimations.csstransforms #close {
display: none;
}
-->
</style>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
function SetCookie(c_name,value,expiredays)
{
var exdate=new Date()
exdate.setDate(exdate.getDate()+expiredays)
document.cookie=c_name+ "=" +escape(value)+";path=/"+((expiredays==null) ? "" : ";expires="+exdate.toUTCString())
}
</script>
<div id="eucookielaw" >
<div id="note">
<img src="/images/cookie_sm.png" alt="Cookie" border="0"> This Site Uses Cookies. :: <a rel="nofollow" href="/terms.php">Learn More</a> :: <a id="close"><u>Close this Message</u> <img src="/images/close_sm.png" alt="Close" border="0"></a>
</div>
<script>
close = document.getElementById("close");
close.addEventListener('click', function() {
note = document.getElementById("note");
note.style.display = 'none';
}, false);
</script>
</div>
<script type="text/javascript">
$("#eucookielaw").show();
SetCookie('eucookie','eucookie',365*10)
</script>
Example he No Claims Discount Insurance | Car, Home, Bike and Health No Claims Bonuses 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 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? 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>
";
?>
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>
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. 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 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. how to close a tab in html or javascript
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;
}
}
I have a page with categories of images. When clicked, each image on the left opens a div with it's own gallery of thumbnails. http://myspringslandscaping.com/portfolio.html Right now, to close a div, the category image has to be clicked a second time. How can I set it so that when one div opens, the other closes automatically? The client wants only one category displayed at a time. Any help would be appreciated. Thanks! Marita 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 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? 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...) |
|||||||