(via https://www.youtube.com/watch?v=XmaWqV1C7mE)
DEAR READER

pixel skylines
KIROKAZE

@theartofmadeline
2025 on Tumblr: Trends That Defined the Year
sheepfilms

Kaledo Art

oozey mess

No title available
No title available

No title available
Cosimo Galluzzi

⁂
will byers stan first human second
🩵 avery cochrane 🩵
he wasn't even looking at me and he found me
taylor price

PR's Tumblrdome
Misplaced Lens Cap
Keni
seen from United States

seen from United States
seen from United States
seen from United States

seen from Brazil
seen from Ecuador

seen from Brazil
seen from Brazil

seen from United States

seen from El Salvador
seen from United States
seen from Ukraine

seen from Saudi Arabia
seen from Philippines
seen from United States

seen from Bahrain

seen from China
seen from United States

seen from United States

seen from United States
@graphics4all
(via https://www.youtube.com/watch?v=XmaWqV1C7mE)
WEB DESIGN MID-TERM CHECKLIST
_______ I uploaded my MIS customized template to the server; it works live. Deadline is Wednesday 5 p.m., any submissions afterwards will lose 10%. No submissions will be checked after Thursday at 5 p.m. (tomorrow.)
DUE BY 5 P.M. THURSDAY, April 17th (Tomorrow)
______ I downloaded the template from "swap-language.com/mid/name/web".
______ I established a root folder in Dreamweaver BEFORE attempting to open the index page!
______ I customized the following:
_______ Concept (What the site is about- you can choose anything appropriate except "shoes".)
_______ Title of index page "Midterm for Name"
_______ ALL text (no user-side evidence that you used a template)
_______ ALL Images (only on index page)
_______ I set up 3 external links on the index page that open in a blank tab.
_______ I uploaded my customized midterm site + all supporting files to "swap-language.com/mid/name/web". This replaced the un-customized content that was in that folder.
_______ I posted the link of my customized midterm site to my blog.
_______ I emailed the link of my blog to [email protected]
25-free-digital-audio-editors
http://www.hongkiat.com/blog/25-free-digital-audio-editors/
2 sites for scripts
http://www.javascriptkit.com/cutpastejava.shtml
http://www.widgetbox.com/tag/html
Popup Image Script Part 2
<a href="images/fictitiousMAG1.jpg" onmouseover="doTooltip(event,0)" onmouseout="hideTip()"><img src="images/fictitiousMAG1.jpg" alt="design"/></a> </li> <li> <a href="images/2013002burgercake.jpg" onmouseover="doTooltip(event,1)" onmouseout="hideTip()"><img src="images/2013002burgercake.jpg" /></a> </li> <li> <a href="images/annualrep1.jpg" onmouseover="doTooltip(event,2)" onmouseout="hideTip()"><img src="images/annualrep1.jpg" /></a>
Popup Image Script Part 1
<SCRIPT TYPE="text/javascript"> <!-- function popup(mylink, windowname) { if (! window.focus)return true; var href; if (typeof(mylink) == 'string') href=mylink; else href=mylink.href; window.open(href, windowname, 'width=800,height=400,scrollbars=yes'); return false; } //--> var dom = (document.getElementById) ? true : false; var ns5 = (!document.all && dom || window.opera) ? true: false; var ie5 = ((navigator.userAgent.indexOf("MSIE")>-1) && dom) ? true : false; var ie4 = (document.all && !dom) ? true : false; var nodyn = (!ns5 && !ie4 && !ie5 && !dom) ? true : false; var origWidth, origHeight; // avoid error of passing event object in older browsers if (nodyn) { event = "nope" } /////////////////////// CUSTOMIZE HERE //////////////////// // settings for tooltip // Do you want tip to move when mouse moves over link? var tipFollowMouse= true; // Be sure to set tipWidth wide enough for widest image var tipWidth= 430; var offX= 15; // how far from mouse to show tip var offY= 12; var tipFontFamily= "Verdana, arial, helvetica, sans-serif"; var tipFontSize= "8pt"; // set default text color and background color for tooltip here // individual tooltips can have their own (set in messages arrays) // but don't have to var tipFontColor= "#000000"; var tipBgColor= "#DDECFF"; var tipBorderColor= "#000080"; var tipBorderWidth= 3; var tipBorderStyle= "ridge"; var tipPadding= 4; // tooltip content goes here (image, description, optional bgColor, optional textcolor) var messages = new Array(); // multi-dimensional arrays containing: // image and text for tooltip // optional: bgColor and color to be sent to tooltip messages[0] = new Array('images/fictitiousMAG.jpg','Magazine Covers','white','black'); messages[1] = new Array('images/adsingle.jpg','Advertising Designs','white','black'); messages[2] = new Array('images/annualreport.jpg','Annual Reports','white','black'); //////////////////// END OF CUSTOMIZATION AREA /////////////////// // preload images that are to appear in tooltip // from arrays above if (document.images) { var theImgs = new Array(); for (var i=0; i<messages.length; i++) { theImgs[i] = new Image(); theImgs[i].src = messages[i][0]; } } // to layout image and text, 2-row table, image centered in top cell // these go in var tip in doTooltip function // startStr goes before image, midStr goes between image and text var startStr = '<table width="' + tipWidth + '"><tr><td align="center" width="100%"><img src="'; var midStr = '" border="0"></td></tr><tr><td valign="top">'; var endStr = '</td></tr></table>'; //////////////////////////////////////////////////////////// // initTip - initialization for tooltip. // Global variables for tooltip. // Set styles // Set up mousemove capture if tipFollowMouse set true. //////////////////////////////////////////////////////////// var tooltip, tipcss; function initTip() { if (nodyn) return; tooltip = (ie4)? document.all['tipDiv']: (ie5||ns5)? document.getElementById('tipDiv'): null; tipcss = tooltip.style; if (ie4||ie5||ns5) { // ns4 would lose all this on rewrites tipcss.width = tipWidth+"px"; tipcss.fontFamily = tipFontFamily; tipcss.fontSize = tipFontSize; tipcss.color = tipFontColor; tipcss.backgroundColor = tipBgColor; tipcss.borderColor = tipBorderColor; tipcss.borderWidth = tipBorderWidth+"px"; tipcss.padding = tipPadding+"px"; tipcss.borderStyle = tipBorderStyle; } if (tooltip&&tipFollowMouse) { document.onmousemove = trackMouse; } } window.onload = initTip; ///////////////////////////////////////////////// // doTooltip function // Assembles content for tooltip and writes // it to tipDiv ///////////////////////////////////////////////// var t1,t2; // for setTimeouts var tipOn = false; // check if over tooltip link function doTooltip(evt,num) { if (!tooltip) return; if (t1) clearTimeout(t1); if (t2) clearTimeout(t2); tipOn = true; // set colors if included in messages array if (messages[num][2]) var curBgColor = messages[num][2]; else curBgColor = tipBgColor; if (messages[num][3]) var curFontColor = messages[num][3]; else curFontColor = tipFontColor; if (ie4||ie5||ns5) { var tip = startStr + messages[num][0] + midStr + '<span style="font-family:' + tipFontFamily + '; font-size:' + tipFontSize + '; color:' + curFontColor + ';">' + messages[num][1] + '</span>' + endStr; tipcss.backgroundColor = curBgColor; tooltip.innerHTML = tip; } if (!tipFollowMouse) positionTip(evt); else t1=setTimeout("tipcss.visibility='visible'",100); } var mouseX, mouseY; function trackMouse(evt) { standardbody=(document.compatMode=="CSS1Compat")? document.documentElement : document.body //create reference to common "body" across doctypes mouseX = (ns5)? evt.pageX: window.event.clientX + standardbody.scrollLeft; mouseY = (ns5)? evt.pageY: window.event.clientY + standardbody.scrollTop; if (tipOn) positionTip(evt); } ///////////////////////////////////////////////////////////// // positionTip function // If tipFollowMouse set false, so trackMouse function // not being used, get position of mouseover event. // Calculations use mouseover event position, // offset amounts and tooltip width to position // tooltip within window. ///////////////////////////////////////////////////////////// function positionTip(evt) { if (!tipFollowMouse) { standardbody=(document.compatMode=="CSS1Compat")? document.documentElement : document.body mouseX = (ns5)? evt.pageX: window.event.clientX + standardbody.scrollLeft; mouseY = (ns5)? evt.pageY: window.event.clientY + standardbody.scrollTop; } // tooltip width and height var tpWd = (ie4||ie5)? tooltip.clientWidth: tooltip.offsetWidth; var tpHt = (ie4||ie5)? tooltip.clientHeight: tooltip.offsetHeight; // document area in view (subtract scrollbar width for ns) var winWd = (ns5)? window.innerWidth-20+window.pageXOffset: standardbody.clientWidth+standardbody.scrollLeft; var winHt = (ns5)? window.innerHeight-20+window.pageYOffset: standardbody.clientHeight+standardbody.scrollTop; // check mouse position against tip and window dimensions // and position the tooltip if ((mouseX+offX+tpWd)>winWd) tipcss.left = mouseX-(tpWd+offX)+"px"; else tipcss.left = mouseX+offX+"px"; if ((mouseY+offY+tpHt)>winHt) tipcss.top = winHt-(tpHt+offY)+"px"; else tipcss.top = mouseY+offY+"px"; if (!tipFollowMouse) t1=setTimeout("tipcss.visibility='visible'",100); } function hideTip() { if (!tooltip) return; t2=setTimeout("tipcss.visibility='hidden'",100); tipOn = false; } document.write('<div id="tipDiv" style="position:absolute; visibility:hidden; z-index:100"></div>') </script>
Calculator Script
<FORM NAME="Calc"> <TABLE BORDER=4> <TR> <TD> <INPUT TYPE="text" NAME="Input" Size="16"> <br> </TD> </TR> <TR> <TD> <INPUT TYPE="button" NAME="one" VALUE=" 1 " OnClick="Calc.Input.value += '1'"> <INPUT TYPE="button" NAME="two" VALUE=" 2 " OnCLick="Calc.Input.value += '2'"> <INPUT TYPE="button" NAME="three" VALUE=" 3 " OnClick="Calc.Input.value += '3'"> <INPUT TYPE="button" NAME="plus" VALUE=" + " OnClick="Calc.Input.value += ' + '"> <br> <INPUT TYPE="button" NAME="four" VALUE=" 4 " OnClick="Calc.Input.value += '4'"> <INPUT TYPE="button" NAME="five" VALUE=" 5 " OnCLick="Calc.Input.value += '5'"> <INPUT TYPE="button" NAME="six" VALUE=" 6 " OnClick="Calc.Input.value += '6'"> <INPUT TYPE="button" NAME="minus" VALUE=" - " OnClick="Calc.Input.value += ' - '"> <br> <INPUT TYPE="button" NAME="seven" VALUE=" 7 " OnClick="Calc.Input.value += '7'"> <INPUT TYPE="button" NAME="eight" VALUE=" 8 " OnCLick="Calc.Input.value += '8'"> <INPUT TYPE="button" NAME="nine" VALUE=" 9 " OnClick="Calc.Input.value += '9'"> <INPUT TYPE="button" NAME="times" VALUE=" x " OnClick="Calc.Input.value += ' * '"> <br> <INPUT TYPE="button" NAME="clear" VALUE=" c " OnClick="Calc.Input.value = ''"> <INPUT TYPE="button" NAME="zero" VALUE=" 0 " OnClick="Calc.Input.value += '0'"> <INPUT TYPE="button" NAME="DoIt" VALUE=" = " OnClick="Calc.Input.value = eval(Calc.Input.value)"> <INPUT TYPE="button" NAME="div" VALUE=" / " OnClick="Calc.Input.value += ' / '"> <br> </TD> </TR> </TABLE>
For Friday
Download the plugin for Photoshop that allows you to save the file in the Windows Icon (ICO) file format. You can download a free plugin called ICO Format from www.telegraphics.com.au/sw/. The instructions for installation are included with the free download.
You can insert the following code within the <head> section of your web pages:
<link id="ctl00_lnkIcon" type="image/vnd.microsoft.icon" rel="shortcut icon" href="images/studentid_favicon.ico" />
Flash button tools to make a use roll over effect
http://www.youtube.com/watch?v=v00tAkkgh8c
Creating interactive buttons can cover a wide variety of options. This tutorial will show you how to use the standard Flash button tools to make a use roll over effect.
http://www.youtube.com/watch?NR=1&v=Zl0J2oajwlE&feature=endscreen
In this tutorial, you will learn how to make basic buttons with a rollover, down, and hit state in Flash CS3.
These are the files for today's project. When you are done, make a jpg file by doing a "PRTSC" (print screen button on top right of keyboard) and pasting into Photoshop and cropping the edges off. Post your final jpg results on your blog.