|
JavaScript - Thumb Nail Veiwer.js Not Opening In Right Place On Screen Bigger Than 15inch
Please help. Have a site uploaded called theshoulderhopper.com, It says domain holding page. when you click on thumbnails on 15 inch screen image opens up ok, but anything bigger image opens up half way down page. Using a thumbnail viewer J.s script. here is copy. I can make image open where I like but how do I get it to open up in correct place on bigger screen? Think it is positioning itself to size of screen not size of page.
// ------------------------------------------------------------------- // Image Thumbnail Viewer Script- By Dynamic Drive, available at: http://www.dynamicdrive.com // Last updated: July 7th, 2008- Fixed enlarged image not showing in IE sometimes // ------------------------------------------------------------------- var thumbnailviewer={ enableTitle: true, //Should "title" attribute of link be used as description? enableAnimation: true, //Enable fading animation? definefooter: '<div class="footerbar"></div>', //Define HTML for footer interface defineLoading: '<img src="loading.gif" /> Loading Image...', //Define HTML for "loading" div /////////////No need to edit beyond here///////////////////////// scrollbarwidth: 16, opacitystring: 'filterrogidXImageTransform.Microsoft.alpha(opacity=10); -moz-opacity: 0.1; opacity: 0.1', targetlinks:[], //Array to hold links with rel="thumbnail" createthumbBox:function(){ //write out HTML for Image Thumbnail Viewer plus loading div document.write('<div id="thumbBox" onClick="thumbnailviewer.closeit()"><div id="thumbImage"></div>'+this.definefooter+'</div>') document.write('<div id="thumbLoading">'+this.defineLoading+'</div>') this.thumbBox=document.getElementById("thumbBox") this.thumbImage=document.getElementById("thumbImage") //Reference div that holds the shown image this.thumbLoading=document.getElementById("thumbLoading") //Reference "loading" div that will be shown while image is fetched this.standardbody=(document.compatMode=="CSS1Compat")? document.documentElement : document.body //create reference to common "body" across doctypes }, centerDiv:function(divobj){ //Centers a div element on the page var ie=document.all && !window.opera var dom=document.getElementById var scroll_top=(ie)? this.standardbody.scrollTop : window.pageYOffset var scroll_left=(ie)? this.standardbody.scrollLeft : window.pageXOffset var docwidth=(ie)? this.standardbody.clientWidth : window.innerWidth-this.scrollbarwidth var docheight=(ie)? this.standardbody.clientHeight: window.innerHeight var docheightcomplete=(this.standardbody.offsetHeight>this.standardbody.scrollHeight)? this.standardbody.offsetHeight : this.standardbody.scrollHeight //Full scroll height of document var objwidth=divobj.offsetWidth //width of div element var objheight=divobj.offsetHeight //height of div element var topposition=(docheight>objheight)? scroll_top+docheight/1.9-objheight/2+"px" : scroll_top+10+"px" //Vertical position of div element: Either centered, or if element height larger than viewpoint height, 10px from top of viewpoint divobj.style.left=docwidth/2.0-objwidth/2+"px" //Center div element horizontally divobj.style.top=Math.floor(parseInt(topposition))+"px" divobj.style.visibility="visible" }, showthumbBox:function(){ //Show ThumbBox div thumbnailviewer.thumbLoading.style.visibility="hidden" //Hide "loading" div this.centerDiv(this.thumbBox) if (this.enableAnimation){ //If fading animation enabled this.currentopacity=0.1 //Starting opacity value this.opacitytimer=setInterval("thumbnailviewer.opacityanimation()", 20) } }, loadimage:function(link){ //Load image function that gets attached to each link on the page with rel="thumbnail" if (this.thumbBox.style.visibility=="visible") //if thumbox is visible on the page already this.closeit() //Hide it first (not doing so causes triggers some positioning bug in Firefox var imageHTML='<img src="'+link.getAttribute("href")+'" style="'+this.opacitystring+'" />' //Construct HTML for shown image if (this.enableTitle && link.getAttribute("title")) //Use title attr of the link as description? imageHTML+='<br />'+link.getAttribute("title") this.centerDiv(this.thumbLoading) //Center and display "loading" div while we set up the image to be shown this.thumbImage.innerHTML=imageHTML //Populate thumbImage div with shown image's HTML (while still hidden) this.featureImage=this.thumbImage.getElementsByTagName("img")[0] //Reference shown image itself if (this.featureImage.complete) thumbnailviewer.showthumbBox() else{ this.featureImage.onload=function(){ //When target image has completely loaded thumbnailviewer.showthumbBox() //Display "thumbbox" div to the world! } } if (document.all && !window.createPopup) //Target IE5.0 browsers only. Address IE image cache not firing onload bug: panoramio.com/blog/onload-event/ this.featureImage.src=link.getAttribute("href") this.featureImage.onerror=function(){ //If an error has occurred while loading the image to show thumbnailviewer.thumbLoading.style.visibility="hidden" //Hide "loading" div, game over } }, setimgopacity:function(value){ //Sets the opacity of "thumbimage" div per the passed in value setting (0 to 1 and in between) var targetobject=this.featureImage if (targetobject.filters && targetobject.filters[0]){ //IE syntax if (typeof targetobject.filters[0].opacity=="number") //IE6 targetobject.filters[0].opacity=value*100 else //IE 5.5 targetobject.style.filter="alpha(opacity="+value*100+")" } else if (typeof targetobject.style.MozOpacity!="undefined") //Old Mozilla syntax targetobject.style.MozOpacity=value else if (typeof targetobject.style.opacity!="undefined") //Standard opacity syntax targetobject.style.opacity=value else //Non of the above, stop opacity animation this.stopanimation() }, opacityanimation:function(){ //Gradually increase opacity function this.setimgopacity(this.currentopacity) this.currentopacity+=0.1 if (this.currentopacity>1) this.stopanimation() }, stopanimation:function(){ if (typeof this.opacitytimer!="undefined") clearInterval(this.opacitytimer) }, closeit:function(){ //Close "thumbbox" div function this.stopanimation() this.thumbBox.style.visibility="hidden" this.thumbImage.innerHTML="" this.thumbBox.style.left="-2000px" this.thumbBox.style.top="-2000px" }, cleanup:function(){ //Clean up routine on page unload this.thumbLoading=null if (this.featureImage) this.featureImage.onload=null this.featureImage=null this.thumbImage=null for (var i=0; i<this.targetlinks.length; i++) this.targetlinks[i].onclick=null this.thumbBox=null }, dotask:function(target, functionref, tasktype){ //assign a function to execute to an event handler (ie: onunload) var tasktype=(window.addEventListener)? tasktype : "on"+tasktype if (target.addEventListener) target.addEventListener(tasktype, functionref, false) else if (target.attachEvent) target.attachEvent(tasktype, functionref) }, init:function(){ //Initialize thumbnail viewer script by scanning page and attaching appropriate function to links with rel="thumbnail" if (!this.enableAnimation) this.opacitystring="" var pagelinks=document.getElementsByTagName("a") for (var i=0; i<pagelinks.length; i++){ //BEGIN FOR LOOP if (pagelinks[i].getAttribute("rel") && pagelinks[i].getAttribute("rel")=="thumbnail"){ //Begin if statement pagelinks[i].onclick=function(){ thumbnailviewer.stopanimation() //Stop any currently running fade animation on "thumbbox" div before proceeding thumbnailviewer.loadimage(this) //Load image return false } this.targetlinks[this.targetlinks.length]=pagelinks[i] //store reference to target link } //end if statement } //END FOR LOOP //Reposition "thumbbox" div when page is resized this.dotask(window, function(){if (thumbnailviewer.thumbBox.style.visibility=="visible") thumbnailviewer.centerDiv(thumbnailviewer.thumbBox)}, "resize") } //END init() function } thumbnailviewer.createthumbBox() //Output HTML for the image thumbnail viewer thumbnailviewer.dotask(window, function(){thumbnailviewer.init()}, "load") //Initialize script on page load thumbnailviewer.dotask(window, function(){thumbnailviewer.cleanup()}, "unload") Similar TutorialsIn homePage(1 photo) and in Gallery(9 photos) at http://www.pafos-wedding.com/ I setup mouse rollover functionality > bigger photo...but bigger image appear below smaller...what to do appear next to smaller, so top side of both photos are on same line? Would anyone know why (and the fix) when I place my cursor over the scrolling thumbnails under the main slideshow rotator on my site they "disappear"? http://americanwebmakers.com/demo_college Thanks in advance! I'm using a jQuery lightbox in addition to a javascript page. When I click on a thumb it retrieves the appropriate div. Right now I have the div img src actually spelled out, but I've got so many of these on the page that it's taking forever to load. How do I tell the document that when I click on the thumbnail, to replace the div image source with the appropriate image? Or, is there an even more efficient way to do this? Here's a sample of my code: Code: <p><a href="#pic1"><img src="images/art/thumb1_t.jpg" alt="A lovely picture" /></a></p> <p><a href="#pic2"><img src="images/art/thumb2_t.jpg" alt="Another lovely picture" /></a></p> <div id="pic1"> <img src="placeholder.gif" alt="A Lovely Picture" /> <p>A whole bunch of details and maybe a list or two</p> </div> <div id="pic2"> <img src="placeholder.gif" alt="Another Lovely Picture" /> <p>A whole bunch of details and maybe some popups</p> </div> The lightbox depends on the "a href='#whatever'" to function. If you need to see it in practice, here is the page. It works, but it is slow to load. http://www.brettkaufman.com/art.html Simple quistion - what's wrong here? The code won't work. Code: <style>
#img {
display:none;
}
</style>
<script>
var n=100;
if(n<150) {
document.getElementById("img").style.display = "block";
}
else {
document.getElementById("img").style.display = "none";
}
</script>
<img src="../warning.png" id="img">
Hello, I Installed a Javascript on my site but the font is very small The code Code: <script type="text/javascript"> TargetDate = "03/12/2010 12:00 PM"; BackColor = ForeColor = CountActive = true; CountStepper = -1; LeadingZero = true; DisplayFormat = "%%D%% يوم, %%H%% ساعة, %%M%% دقيقة, %%S%% ثانية"; FinishMessage = "It is finally here!"; </script> <script type="text/javascript" src="http://f1zcdn.appspot.com/js/countdown.js"></script> How can i make the font in "yellow" bigger ? Thank you Hi, This is my site at the moment in testing: http://whnpf.perdu.servertrust.com/ I have the ideal layout of my slides underneath the actual slide itself. My problem is, everytime I copy the code and place it in again, for some reason the slide goes to the next line and not next to the other slide. Here is my code for the current slide: <script type="text/javascript" src="/v/vspfiles/assets/images/stepcarousel.js"></script> <script type="text/javascript" src="/v/vspfiles/assets/images/stepcarousel.js"> </script> <style type="text/css"> .stepcarousel{ position: relative; /*leave this value alone*/ border: 1px solid GREY; overflow: scroll; /*leave this value alone*/ width: 313px; /*Width of Carousel Viewer itself*/ height: 262px; /*Height should enough to fit largest content's height*/ } .stepcarousel .belt{ position: absolute; /*leave this value alone*/ left: 0; top: 0; } .stepcarousel .panel{ float: left; /*leave this value alone*/ overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/ margin: 0px; /*margin around each panel*/ width: 313px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */ } </style> <script type="text/javascript"> stepcarousel.setup({ galleryid: 'mygallery', //id of carousel DIV beltclass: 'belt', //class of inner "belt" DIV containing all the panel DIVs panelclass: 'panel', //class of panel DIVs each holding content autostep: {enable:true, moveby:1, pause:3000}, panelbehavior: {speed:500, wraparound:false, wrapbehavior:'slide', persist:true}, defaultbuttons: {enable: true, moveby: 1, leftnav: ['/v/vspfiles/assets/images/backward.jpg', 80, 215], rightnav: ['/v/vspfiles/assets/images/forward.jpg', -135, 215]}, statusvars: ['statusA', 'statusB', 'statusC'], //register 3 variables that contain current panel (start), current panel (last), and total panels contenttype: ['inline'] //content setting ['inline'] or ['ajax', 'path_to_external_file'] }) </script> <div id="mygallery" class="stepcarousel"> <div class="belt"> <div class="panel"> <img src="/v/vspfiles/assets/images/HOTDEALS.jpg" /> </div> <div class="panel"> <img src="/v/vspfiles/assets/images/POPULAR.jpg" /> </div> <div class="panel"> <img src="/v/vspfiles/assets/images/HOTDEALS.jpg" /> </div> <div class="panel"> <img src="/v/vspfiles/assets/images/POPULAR.jpg" /> </div> <div class="panel"> <img src="/v/vspfiles/assets/images/HOTDEALS.jpg" /> </div> </div> </div> Any help would be greatly appreciated, thank you Hi there, I've got a div with an id of messages - It is essentially a chat system however chat usually adds messages to the bottom of a list which means the messages do not get pushed down while you are reading them. This system instead adds the messages to the top. I need a way of finding the current scroll position so that when a new message is added the scroll remains in the same place. I've been trying to work this out for a while now, any advice or code would be greatly appreciated. Hi, I need to open a PDF file via a web page. Basically, I want to have a textbox where I type in a filename and then click submit and it will open that document. For example, I need to open a PDF document... I need to have a text box where I can input "test1" for example, click "GO" and it will add the "C:/test/" + textbox value + ".pdf" and open it in the browser. I could do it in PHP but this is going to run on a local machine with no serverside so I assume JS will be the way forward. Any ideas? Many Thanks MJFCAD I want to open a new tab "http://www.example.com/" when the user presses a key. How can this be done?
Hello all, I'm trying to open up an internal link from my leftnav div into my content div. I used the following JS code from my book but im not quite sure how to make it all work. Any thoughts appreciated. Thank you Code: <!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">
<head>
<!--header script starts here -->
<script type="text/javascript">
window.onload = initlinks;
function initlinks() {
for (var i = 0; i < document.links.length; i++) {
document.links[i].onclick = setContent;
}
}
function setContent() {
document.getElementById("content").contentWindow.document.location.href = this.href;
return false;
}
</script>
<style type="text/css">
html, body
{
margin: 0;
padding: 0;
}
#container
{
width: 90%;
margin: 10px auto;
background-color: #fff;
color: #333;
border: 1px solid gray;
line-height: 130%;
}
#header
{
height: 60px;
background-color: #ddd;
border-bottom: 1px solid gray;
}
#leftnav
{
float: left;
width: 160px;
height: 380px;
margin: 0;
padding: 1em;
}
#content
{
margin-left: 200px;
border-left: 1px solid gray;
padding: 1em;
height: 380px;
}
</style>
<title>JavaScript</title>
</head>
<body>
<div id="container">
<div id="header">
<h1>JavaScript</h1>
</div>
<div id="leftnav">
<p>
<a href='#'>Load Content</a> <br /><br />
<a href='#'>Load Content</a> <br /><br />
<a href='#'>Load Content</a> <br /><br />
<a href='#'>Load Content</a> <br /><br />
<a href='#'>Load Content</a> <br /><br />
</p>
</div>
<!--Div to load content into-->
<div id="content">
<h2>Subheading</h2>
<p>
Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel erat volutpat.
</p>
</div>
</div>
</body>
</html>
is there a way in HTML or Javascript to open a new window and force it to be a new Window, not a new tab? and also avoid popup blockers??
Ok, newbie here. Like, REAL new. Anyway, used some script for an animated drop down menu from clarklab.net. I want users to click on menu to expand to sub's, but I can't figure out how to fix it from expanding every single one. I also want users to be able to close back up. Help? I am ready to jump. Thanks Here is the site, vertical navigation on left side: Here's ma' code Code: <script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("ul.menu_body li:even").addClass("alt");
$('.menu_head').click(function () {
$('ul.menu_body').slideToggle('medium');
});
$('ul.menu_body li a').mouseover(function () {
$(this).animate({ fontSize: "14px", paddingLeft: "20px" }, 50 );
});
$('ul.menu_body li a').mouseout(function () {
$(this).animate({ fontSize: "12px", paddingLeft: "10px" }, 50 );
});
});
</script>
Code: <div class="container">
<div class="menu_head_nodrop"><p><a href="administrativeservices.html">Administrative Services</a></p>
</div>
<div class="menu_head_nodrop">
<p><a href="birthdeathcertificates.html">Birth & Death Records</a></p>
</div><div class="menu_head">
<p>Construction Programs</p>
</div>
<ul class="menu_body">
<li><a href="manufacturedhomes.html">Manufactured Homes Installation</a></li>
<li><a href="plumbingprogram.html">Plumbing Inspections</a></li>
<li><a href="healthyhomes.html">Healthy Homes</a></li>
</ul><div class="menu_head">
<p>Environmental Health</p>
</div><ul class="menu_body">
<li><a href="environmentalhealth.html">Beach Monitoring</a></li>
<li><a href="rabies.html">Rabies Control</a></li>
<li><a href="foodprotection.html">Food Service</a></li>
<li><a href="householdsewage.html">Sewage Treatment Systems</a></li>
<li><a href="Radon.html">Radon</a></li>
<li><a href="leadsafety.html">Lead Safety</a></li>
<li><a href="manufacturedhome.html">Manufactured Home Parks</a></li>
<li><a href="marinas.html">Marinas</a></li>
<li><a href="http://0052c90.netsolhost.com/nuisance.html">Nuisance Complaints</a></li>
<li><a href="privatewater.html">Private Water Systems</a></li>
<li><a href="poolandspa.html">Public Swimming Pools & Spas</a></li>
<li><a href="realestatesurveys.html">Real Estate Surveys</a></li>
<li><a href="rvparks.html">RV Parks & Campgrounds</a></li>
<li><a href="http://www.odh.ohio.gov/odhPrograms/eh/schooleh/sehmain.aspx" target="_blank">Schools</a></li>
<li><a href="tattooandbody.html">Tattoo & Body Piercing</a></li>
</ul><div class="menu_head">
<p>Health Education & Outreach</p>
</div><ul class="menu_body">
<li><a href="communityhealth.html">Community Health</a></li>
<li><a href="http://www.scrubclub.org/home.aspx" target="_blank">Handwashing</a></li>
<li><a href="healthyhomes.html">Healthy Homes</a></li>
<li><a href="leadsafety.html">Lead Safety</a></li>
<li><a href="lifeskills.html">LifeSkills</a>
<li><a href="schoolwellness.html">School Wellness</a>
<li><a href="smokefreeworkplace.html">Smoke Free Workplace</a></li>
<li><a href="teenpregnancy.html">Teen Pregnancy Prevention</a></li>
</ul><div class="menu_head">
<p>Nursing & Clinic Services</p>
</div><ul class="menu_body">
<li><a href="familypractice.html">Family Practice Services</a></li>
<li><a href="bccpinfo.html">Breast & Cervical Cancer Program</a></li>
<li><a href="childrenshealth.html">Sports & Work Physicals</a></li>
<li><a href="specialneedschildren.html">Children with Special Needs</a></li>
<li><a href="communicabledisease.html">Communicable Disease</a></li>
<li><a href="familyplanningclinic.html">Family Planning</a></li>
<li><a href="helpmegrow.html">Help Me Grow</a></li>
<li><a href="HIVAIDS.html">HIV/AIDS Testing</a></li>
<li><a href="homehealthcare.html">Home Health Care</a></li>
<li><a href="immunizationfaqs.html">Immunization/Shots</a></li>
<li><a href="leadscreeningandtesting.html">Lead Screening & Testing</a></li>
<li><a href="prenatalclinic.html">Pregnancy Testing & Assistance</a></li>
<li><a href="schoolnursing.html">School Nursing</a></li>
<li><a href="seniorclinic.html">Senior Clinic</a></li>
<li><a href="specialtyclinics.html">Outreach Clinics</a></li>
<li><a href="HIVAIDS.html">STD Clinic</a></li>
<li><a href="tbtesting.html">TB Testing</a></li>
</ul><div class="menu_head">
<p>Public Health Preparedness</p>
</div><ul class="menu_body">
<li><a href="publichealth.html">General Information</a></li>
<li><a href="medicalreservecorps.html">Medical Reserve Corps</a></li>
</ul><div class="menu_head">
<p>WIC</p>
</div><ul class="menu_body">
<li><a href="wic.html">WIC Services</a></li>
<li><a href="http://www.odh.ohio.gov/odhPrograms/ns/wicn/wic1.aspx" target="_blank">Learn More About WIC</a></li>
</ul>
</div>
You can see the website here with all the code to make it easier for you to diagnose what is happening: Code: http://www.fdfdaa.com/desktop/desktop.html When you go to the start menu and select anything on the left side, you will see that windows open 100% of the screen by default. I did that by adding maximized:true but that doesn't appear to be working for the icons on the desktop itself. If you click on one of those 4 icons on the desktop though, it isn't opening at 100% for some reason. You can see my classes file here as well: Code: http://www.fdfdaa.com/desktop/classes.js Any help will be greatly appreciated. Thank you for your time! I have a mortgage calc that is adding an extra decimal place to my interest rate. To see this in action go to: http://www.keithknowles.com/elmtree/mortgagecalc2.htm Change the interest rate to 7.5 Click Calculate Payment Click Create Amortization Chart On the following screen you'll see a recap of your data and the interest rate will now say 7.55. Same thing happens if you enter 6.2. Next screen shows 6.22/ I've attached the html and js files in a zip. Any help is greatly appreciated. Thanks. Hi All, Im currently working on a bidding application built within ASP.Net and i have found this javascript snippet to only allow numeric values in the desired <asp:textbox> which is working fine, but i want to allow the user to add a decimal place. For example, say the bid is 1.50 they should be allowed to enter 1.51 but as i cant imput (.) i end up putting in 151 heres the snippet it may be a slight modification but im new to javascript so any help of knowledge will be highly appreciated Code: function isNumberKey(evt)
{
var charCode = (evt.which) ? evt.which : event.keyCode
if (charCode > 31 && (charCode < 48 || charCode > 57))
return false;
return true;
}
thanks in advance Is it possible to place links in a text area box? I tried the below but it doesn't work but how can it be done. Any suggestions? Tracy Code: <textarea rows="2" name="S1" cols="20"> <a href="http://yahoo.com">Yahoo</a><br> <a href="http://google.com">Google</a> </textarea> ok so here what i want to do (im a noob): i want a dropdown menu i want a button (go) i want ten different items in the dropdown menu if i choose the first item and click go i want a new page to open in the same window if i choose the second item and click go i want to a different page to open in the same window and so on all ten items lead to a different link when i click go....how do i do this?? thanks!! Hi, I am having some problems with this modified version of Lightbox. I had a programmer implement this into the site and then one day it just stopped working. I'm trying to fix it myself, with no success. To view the problem go to: http://www.uscgq.com/question/deck/2 and click the red flag icon. The lightbox opens, but only shows the "Loading" message. I have isolated the problem to somewhere in the Lightbox.js just don't know where or what it is. Any help is greatly appreciated! Code: /*
Created By: Chris Campbell
Website: http://particletree.com
Date: 2/1/2006
Inspired by the lightbox implementation found at http://www.huddletogether.com/projects/lightbox/
*/
/*-------------------------------GLOBAL VARIABLES------------------------------------*/
var detect = navigator.userAgent.toLowerCase();
var OS,browser,version,total,thestring;
/*-----------------------------------------------------------------------------------------------*/
//Browser detect script origionally created by Peter Paul Koch at http://www.quirksmode.org/
function getBrowserInfo() {
if (checkIt('konqueror')) {
browser = "Konqueror";
OS = "Linux";
}
else if (checkIt('safari')) browser = "Safari"
else if (checkIt('omniweb')) browser = "OmniWeb"
else if (checkIt('opera')) browser = "Opera"
else if (checkIt('webtv')) browser = "WebTV";
else if (checkIt('icab')) browser = "iCab"
else if (checkIt('msie')) browser = "Internet Explorer"
else if (!checkIt('compatible')) {
browser = "Netscape Navigator"
version = detect.charAt(8);
}
else browser = "An unknown browser";
if (!version) version = detect.charAt(place + thestring.length);
if (!OS) {
if (checkIt('linux')) OS = "Linux";
else if (checkIt('x11')) OS = "Unix";
else if (checkIt('mac')) OS = "Mac"
else if (checkIt('win')) OS = "Windows"
else OS = "an unknown operating system";
}
}
function checkIt(string) {
place = detect.indexOf(string) + 1;
thestring = string;
return place;
}
/*-----------------------------------------------------------------------------------------------*/
Event.observe(window, 'load', initialize, false);
Event.observe(window, 'load', getBrowserInfo, false);
Event.observe(window, 'unload', Event.unloadCache, false);
var lightbox = Class.create();
lightbox.prototype = {
yPos : 0,
xPos : 0,
initialize: function(ctrl) {
this.content = ctrl.href;
Event.observe(ctrl, 'click', this.activate.bindAsEventListener(this), false);
ctrl.onclick = function(){return false;};
},
// Turn everything on - mainly the IE fixes
activate: function(){
if (browser == 'Internet Explorer'){
this.getScroll();
this.prepareIE('100%', 'hidden');
this.setScroll(0,0);
this.hideSelects('hidden');
}
this.displayLightbox("block");
},
// Ie requires height to 100% and overflow hidden or else you can scroll down past the lightbox
prepareIE: function(height, overflow){
bod = document.getElementsByTagName('body')[0];
bod.style.height = height;
bod.style.overflow = overflow;
htm = document.getElementsByTagName('html')[0];
htm.style.height = height;
htm.style.overflow = overflow;
},
// In IE, select elements hover on top of the lightbox
hideSelects: function(visibility){
selects = document.getElementsByTagName('select');
for(i = 0; i < selects.length; i++) {
selects[i].style.visibility = visibility;
}
},
// Taken from lightbox implementation found at http://www.huddletogether.com/projects/lightbox/
getScroll: function(){
if (self.pageYOffset) {
this.yPos = self.pageYOffset;
} else if (document.documentElement && document.documentElement.scrollTop){
this.yPos = document.documentElement.scrollTop;
} else if (document.body) {
this.yPos = document.body.scrollTop;
}
},
setScroll: function(x, y){
window.scrollTo(x, y);
},
displayLightbox: function(display){
$('overlay').style.display = display;
$('lightbox').style.display = display;
if(display != 'none') this.loadInfo();
},
// Begin Ajax request based off of the href of the clicked linked
loadInfo: function() {
var myAjax = new Ajax.Request(
this.content,
{method: 'post', parameters: "", onComplete: this.processInfo.bindAsEventListener(this)}
);
},
// Display Ajax response
processInfo: function(response){
console.log('calling process info');
if($('lbHeader'))
Element.remove($('lbHeader'));
info = "<div id=\"lbHeader\"><a href=\"javascript: closeLightboxes();\">close</a> or hit ESC</div><div id='lbContent'>" + response.responseText + "</div>";
new Insertion.Before($('lbLoadMessage'), info)
$('lightbox').className = "done";
this.actions();
},
// Search through new links within the lightbox, and attach click event
actions: function(){
lbActions = document.getElementsByClassName('lbAction');
for(i = 0; i < lbActions.length; i++) {
Event.observe(lbActions[i], 'click', this[lbActions[i].rel].bindAsEventListener(this), false);
lbActions[i].onclick = function(){return false;};
}
},
// Example of creating your own functionality once lightbox is initiated
insert: function(e){
link = Event.element(e).parentNode;
Element.remove($('lbContent'));
var myAjax = new Ajax.Request(
link.href,
{method: 'post', parameters: "", onComplete: this.processInfo.bindAsEventListener(this)}
);
},
// Example of creating your own functionality once lightbox is initiated
deactivate: function(){
if($('lbHeader'))
Element.remove($('lbHeader'));
Element.remove($('lbContent'));
if (browser == "Internet Explorer"){
this.setScroll(0,this.yPos);
this.prepareIE("auto", "auto");
this.hideSelects("visible");
}
this.displayLightbox("none");
}
}
/*-----------------------------------------------------------------------------------------------*/
// Onload, make all links that need to trigger a lightbox active
function initialize(){
addLightboxMarkup();
lbox = document.getElementsByClassName('lbOn');
for(i = 0; i < lbox.length; i++) {
valid = new lightbox(lbox[i]);
}
}
// Add in markup necessary to make this work. Basically two divs:
// Overlay holds the shadow
// Lightbox is the centered square that the content is put into.
function addLightboxMarkup() {
bod = document.getElementsByTagName('body')[0];
overlay = document.createElement('div');
overlay.id = 'overlay';
lb = document.createElement('div');
lb.id = 'lightbox';
lb.className = 'loading';
lb.innerHTML = '<div id="lbLoadMessage">' +
'<p>Loading</p>' +
'</div>';
bod.appendChild(overlay);
bod.appendChild(lb);
}
// Send AJAX Call
function sendForm(url)
{
new Ajax.Updater('lbContent', url, { method: 'post', parameters: Form.serialize($('content_form'),true) });
}
// Function to destroy lightbox elements
function closeLightboxes()
{
if(lightbox.prototype)
lightbox.prototype.displayLightbox('none');
if($('lbHeader'))
Element.remove($('lbHeader'));
if($('lbContent'))
Element.remove($('lbContent'));
}
// Close the lightbox if ESC is pressed
document.onkeypress=function(e){
var KeyID = (window.event) ? event.keyCode : e.keyCode;
if(KeyID == 27)
{
closeLightboxes();
}
}
Hello, I need your help, I have the following code below, and its giving me an error saying: "The system cannot find the file specified". Code: <html>
<script language="javascript" type="text/javascript">
function start_ccm(){
var wsh = new ActiveXObject('WScript.Shell');
wsh.exec("C:\Program Files\WorkDynamics Technologies\ccmApplications\ccmMercury.exe")
}
</script>
</head>
<body>
<input id="Button1" onclick="start_ccm()" type="button" value="START" />
</body>
</html>
There is nothing wrong with the location, but my best guess are the spaces in the file path. Any help with this is greatly appreciated. Cheers, J |
|||||||