JavaScript - Tool Tip And Model Window In Js
Hi, I am working on a project and in that I have to create:
Image-map tooltip (Mouseover) + Model window (On Click) Can anyone share the tutorials or any suggestions to start with. Thanks Vikrant Similar TutorialsHey, I was wondering what this tool is called: http://jsgame.mycdn.in/images/screen.png I assume it's some kind of text editor, I've seen it running in Windows and Linux. Thanks for your help Hey guys, this is an assignment for school. I have most of the code done but I cant figure out how to completely finish one part of the assignment. I bolded the part in which i'm having trouble with. Heres the Directions per the Instructor: Create a new HTML document that creates a listing of the days and date for the current month. 1. Create a new array, named monthArray that holds the names of the all of the months in a year, i.e. January, February… 2. Create a new array, named weekDaysArray that holds all of the days of the week, i.e. Sun, Mon, Tue,…. 3. Get today’s date by using the Date object, without initializing a value for the object and save it in a variable named todaysDate. a. Using the Date object methods, break up the value of todaysDate into variables that hold each of the pieces of the date, by assigning the values to the following variables: (see page 169 in text) i. currYr = year ii. currMon = month as an integer iii. currDate = day of the month iv. currDay = the day of the week as an integer 4. Use a document.write statement display the name of the month followed by the 4 digit year. (i.e. October 2011) a. Use currMon as the index to get the name of the month from the monthArray created in step 1. b. Use the variable currYr created in step 3. c. Include a blank line after this displayed line 5. Determine the name of the first day of the current month. a. Using the correct Date Object method, get the integer for the day of the week for the first day of the current month. (hint: you will need to pass the year, month and the day value of 1 to the Date Object to get this number) 6. Use a document.write statement to display every day of the current month on a new line in the format of the name of the day followed by the integer for the date. a. Use a while loop to keep track of the number of days written for the month. b. Use a for loop to write out the days of the week from the array created in step 2 under the name of the current month and year. Example output: October 2011 Sat 1 Sun 2 Mon 3, etc….until all 31 days are displayed. My Code: 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" xml:lang="en" lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Assignment 9</title> <script type="text/javascript"> var monthArray = new Array ("January","February","March","April","May","June","July","August","September","October","November","December"); var weekDaysArray = new Array ("Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"); var todaysDate = new Date(); var currYr = todaysDate.getFullYear(); var currMon = todaysDate.getMonth(); var currDate = todaysDate.getDate(); var currDay = todaysDate.getDay(); document.write(monthArray[currMon] + " " +currYr); document.write("<br />"); document.write(weekDaysArray[currDay] + "<br />"); var count = 0; while (count < 31) { count++; } for(var count = 0 ; count < 31 ; count++) { document.write(weekDaysArray[count]+ "<br />"); } </script> </head> <body> </body> </html> Greeting....! Does anyone know that how's the JavaScript memory model work? I mean as we know that a Stack stores primitive type variables and references, a Heap stores referenced type object, what about functions? Should functions are stored at a Memory or what I said is wrong. Is there any books or resources are talking about JavaScript Memory Model? Thanks a lot!!!! Dan I read tutorials and pdfs on the DOM and its pissing me off coz ther not showing me or answering my questions. Can someone please explain to me how to use the DOM. Like: 1) Can i create child nodes or parents? And if so when and how? 2) How do i look at a parent node (lets say of a list) and select a specific child (part of the list)? Thank You Hello webmasters , Iam looking for "fonts picker" tool just like "color picker" ...please help me to find one.... i hope JQUERY has solution for this but not able to fix this.... guyzz plz help me find fonts picker to use it in user input forms...Any response appreciated... Thank you... I am using tooltip plug in on a site and when I use it on a blank template, it works then when I transfer it to the page I want to use it on it does not work. The site is Here is they javascript code: Code: this.imagePreview = function(){ /* CONFIG */ xOffset = 10; yOffset = 30; // these 2 variable determine popup's distance from the cursor // you might want to adjust to get the right result /* END CONFIG */ $("a.preview").hover(function(e){ this.t = this.title; this.title = ""; var c = (this.t != "") ? "<br/>" + this.t : ""; $("body").append("<p id='preview'><img src='../"+ this.href +"' alt='Image preview' />"+ c +"</p>"); $("#preview") .css("top",(e.pageY - xOffset) + "px") .css("left",(e.pageX + yOffset) + "px") .fadeIn("fast"); }, function(){ this.title = this.t; $("#preview").remove(); }); $("a.preview").mousemove(function(e){ $("#preview") .css("top",(e.pageY - xOffset) + "px") .css("left",(e.pageX + yOffset) + "px"); }); }; // starting the script on page load $(document).ready(function(){ imagePreview(); }); Here is the HTML code. Code: <ul> <li><a href="mailto:rragon@cumberland.k12.il.us">Mr. Russell Ragon</a> <a href="../../Images/staffbios/rragon.gif" class="preview"><img src="1s.jpg" alt="BIO" /></a></li> </ul> Here is the CSS code: Code: #preview{ position:absolute; border:1px solid #ccc; padding:5px; display:none; color:#fff; background-color: #333; } This is my first post on this forum so I hope the code is clear you can check out the site up above just hover over one of the names. I am only getting image preview instead of the image I want. Ont thing I did do was I took out the image so I could get the Alternate code. My objective here is to have a name and when you hover over it an image pops up and on the image will be a biography of the teacher. Thanks for any help. Hi, I'm Jon. First of all excuse me if I posted this thread in the wrong forum, I really have no clue where to put this but I've had some minor experience with js so I hope it can be solved this way. I check websites and/or keywords in googles Keyword Tool External as a free service for some of my clients. The thing is that more and more clients like this service and it's becoming very time-consuming for me to do this for all of them. Is there a way to let my clients fill in the keywords or url they like researched in a form on my website, then let those words be researched and return a specified number of results in a pdf or something? My biggest concern is the captcha code. If I can't find a way to partially or fully automate this process, I'll be forced to either charge for or completely give up this service. Can anyone help me with some kind of solution? Thanks in advance. Jon A general question really, but does anyone have a good technique or source for creating disabled versions of tool bar buttons? Many thanks for any assistance, S I just found this web scraping tool at http://www.heliumscraper.com and I was wonderin if anyone have used it. They say on the web page you can automate it with JavaScript.
I write code using ext js,openlayers and GeoExt for measuring length and area ,it is working inside inside of india in the world map but this measure tool is not working outside of india in the world map. My code for Measure length: To Load map: var projWGS84 = new OpenLayers.Projection("EPSG:4326"); var projSphericalMercator = new OpenLayers.Projection("EPSG:900913"); var bounds = new OpenLayers.Bounds(68.137, 6.783, 97.336, 37.086); bounds.transform(projWGS84, projSphericalMercator); map.maxExtent = bounds; var gphy = new OpenLayers.Layer.Google("Google Street", { 'sphericalMercator':true //maxExtent: new OpenLayers.Bounds(-20037508, -20037508,20037508, 20037508) } ); var osmLayer = new OpenLayers.Layer.OSM(); // Add the background images via WMS // Add the background images via WMS //map.addLayer(bglayer); // map.addControl(new OpenLayers.Control.MousePosition()); map.addLayers([gphy, osmLayer]); Measure Length: Measure = new Ext.SplitButton({ text:"Measure", iconCls:"icon-measure-length", toggleGroup:"navigate", group: "navigate", enableToggle:true, allowDepress:false, handler: function(button, event) { // allowDepress should deal with this first condition if(!button.pressed) { button.toggle(); } else { button.menu.items.itemAt(activeIndex).setChecked(t rue); } }, listeners: { toggle: function(button, pressed) { // toggleGroup should handle this if(!pressed) { button.menu.items.each(function(i) { i.setChecked(false); }); } }, render: function(button) { // toggleGroup should handle this Ext.ButtonToggleMgr.register(button); } }, menu: new Ext.menu.Menu({ items: [ new Ext.menu.CheckItem( new GeoExt.Action({ text: "Length", toggleGroup:"navigate", iconCls:"icon-measure-length", group: "navigate", enableToggle:true, allowDepress:false, map: map, control: new OpenLayers.Control.Measure(OpenLayers.Handler.Path , { eventListeners: { measu function(evt) { Ext.MessageBox.show({ title: 'Line length :', buttons: Ext.MessageBox.OK, width:200, msg:"Line Length: " + evt.measure.toFixed(2) + " " + evt.units }); } } }) }) ) } }) }) ) ] }) }) Hello all, I am enrolled in a class that requires a bit of JS/HTML coding; my final project is to create a simple page representing myself. See example. And yes, that is my teacher. I am allowed to utilize "templates or tools". I am using my macbook, but I have access to school windows computers. Any suggestions on what to use to complete this assignment are greatly appreciated. Hello everyone, for starters, I'm NOT working with arrays...with that being said, I need your help...I created a webform in PHP that retrieves values from a mysql table and displays them with its own mysqli_fetch_array command, in that loop it generates a textbox for each record...so far so good. The created textbox (input element) is so that the user can type in the sequential number of how to reorder the records...example Original Order of Records 1 Alpha 2 Bravo 3 Charlie 4 Delta 5 Echo and user needs it to be in this order User input sequential 2 Alpha 5 Bravo 1 Charlie 4 Delta 3 Echo the new order of the records will be saved on a temporary table in the database before insertion on the main table, kinnda like a preview for the new order, something like this: New Order of Records 1 Charlie 2 Alpha 3 Echo 4 Delta 5 Bravo Now what I need is a function that helps me display a message if the user duplicates a sequential unique, if they type in number 1 in 2 or more records, when I hit the button for the preview I need it to loop through all the input boxes and check their values, compare it with the other inputs and determine if there are duplicates or not....if there're no duplicates, continue with PHP code.....if there are duplicates, display an error so the user seeks for the duplicate and change it (inputs left in blank will not be considered for the insertion in the preview table) I already have this: Code: function checkall() { const t='texto'; var contar=<?php echo $contar; ?>; var text = "" var conta = 1; var contas= conta+1; text = t+conta; texto = t+contas; //var curElement = document.activeElement.value; var cv=document.forms['OrderPreview'][text].value; //var cv=document.forms['OrderPreview'][curElement].value; do { //var cv=document.forms['OrderPreview'][text].value; if (document.forms['OrderPreview'][texto].value=="") { return; } if (cv==document.forms['OrderPreview'][texto].value) { alert("Something Bad"); } conta++; contas++; text = t+conta; texto = t+contas; } while (conta<=contar) } Btw, the document.activeElement part of the code displays me "undefined" in the alert message, I still don't have a clue why, could you guide me with this please? I can't do but compare the 1st input with the rest of the fields, OR compare one field to the inmediate next field....it's driving me nuts Any help will be truly appreciated, thanks in advance Hi Folks, I'm developing a software tool that can create the basic software outline (classes, modules, functions) from natural language. (The problem definition document for example) The benefits of a initial software structure are an enhanced software performance, and a greater adaptability later on. I was wondering for what purposes this tool would be interesting? And if an integrating this with a programming language would be interesting, so a pre-programmed code divided over several classes emerges. Best regards, viaBox -=-=-=-=-=-=-=-=-=-=-=-=-=-=- http://budurl.com/ViaBox =-=-=-=-=-=-=-=-=-=-=-=-=-=-= Hello, I need to know that is there any script available which allows me to upload an image and after uploading it will allow me to crop an image like we do in photoshop via pen tool. In photoshop when we use pen tool, it apply nodes against the images and user can easily change nodes via mouse to change the position of cropping. Is there any type of script available which provides this functionality? Thanks The tool tip box is way out and off in Chrome browser when I scroll down the page. Please check, download and go through this html file link - http://www.alparin.com/webtest/ixbrl_output2.htm and see what's wrong in the stylesheet/javascript code. I am just so desperate of moving forward with this issue still hanging in the air. Many thanks in advance for help and assistance! Hi, I've made a web based tool that times how long a web page takes to load in an iframe and today I redesigned it but now it has issues. When I load it in Chrome and Opera the new version works fine but in FF 3.6 and IE 8 only the footer area is displayed. I have added the links below - You'll be able to access the code via your browser's "View page Source" option. URLs: New test (With problem): http://browserspeedtest.camerongray....net/version31/ Old test (Works perfectly): http://browserspeedtest.co.cc Any help is greatly appreciated! Cameron Gray i have this code i need to close the parent.html window when the child window opened, i need the code for that working well in IE and Firefox Parent.html <HTML> <SCRIPT TYPE="text/javascript"> function sendTo() { window.open('child.html','_blank','resizable=yes,width='+(screen.width-500)+',height='+(screen.height-500)+''); } </SCRIPT> <BODY > <form name="form"> <input type="text" value="" name="text1" id="pdetails1"> <input type="text" value="" name="text1" id="pdetails2"> </br> <input type="submit" value="submit" onClick="sendTo()"> </BODY> </HTML> child.html <html> <body> <form> <input type=text name="text5" value=""> <input type=submit name="submit"value="submit"> </form> </body> </html> Hello all, and thank you for your coments, I want to preserve a 16/9 aspect ratio to the window after any resize, making the width a function of the height. As I have a window.resizeTo() inside the window.onresize event function, the infinite loop is served. How may I quit it? Code: <html><head><title>Title</title><script languaje="javascript"> const c_ra=16/9; window.onresize = function WindowReSize() { var myWidth = 0, myHeight = 0; if( typeof( window.innerWidth ) == 'number' ) { //Non-IE // myWidth = window.innerWidth; myHeight = window.innerHeight; } else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) { //IE 6+ in 'standards compliant mode' // myWidth = document.documentElement.clientWidth; myHeight = document.documentElement.clientHeight; } myWidth = Math.floor(myHeight*c_ra); window.resizeTo(myWidth,myHeight); // ** CAUTION resize event in a onresize event handler ! }; </script></head><body><p>Hello World</p></body></html> Greetings all, I picked up a Theme Forest site template and I'm trying to remove the social media tools for Facebook & Twitter from the "work" section on my site. When a picture is clicked you can see the social media buttons at the bottom of the viewer and I'd like to remove that function. Site with issues: www.lenoxcruthers.com Here is a dropbox file containing my java script files: https://www.dropbox.com/sh/io29dadjx23haa7/nPE-jJcP06 Thanks, <!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" lang="en" xml:lang="en" > <title>Assignment 5 - JavaScript Loops</title> <head> <script type="text/javascript"> function getGrade(){ var i= Number(document.getElementById("input1").value); m=Math.floor(i/2); for(var k=1; k<=i; k++){ for(var j=1; j<=k; j++){ document.write(j+" "); if(j==k){ document.write("\n"); } if(j==i){ decreaseLoop(j, k); } } } function decreaseLoop(j, k){ for(k=k-1; k>0; k--){ for(var l=1; l<=k; l++){ document.write(l+" "); if(l==k){ document.write("\n"); } } } } } </script> <style type="text/css"> #main{ margin:auto; width:70%; } #top{ font-size:20px; font-weight:bolder; color:#007700; text-decoration:underline; } #s1{ font-size:20px; font-weight:bold; color:#7700ff; } #s2{ font-size:20px; font-weight:bold; color:#00ff00; } #s3{ font-size:20px; font-weight:bold; color:#ff0000; } #form1{ width:600px; height:80px; padding:20px; background-color:#aaaaaa; } </style> </head> <body> <div id="main"> <p id="top">Assignment 5 - JavaScript Loops</p> <span id=s1>This is Form for checking Loop</span> <form id=form1 name=form1> <table> <tr><td>Enter Number </td><td>: <input type="text" id=input1 name="input1" /></td></tr> <tr><td><input type="button" name=btn1 value="Get Number" onclick=getGrade() /></td></tr> </table> </form> </div> </body> </html> When I execute this code, on the screen I see all output in one line. Which is not hat I want. But when I see it in Firebug (for firefox)or Developer Tool Bar(for IE) , I see it printed out in pyramid form(as required). So why is this output in one line on screen ? How cn I get it in pyramid form ? Thanks |