|
JavaScript - Serving Css To Safari
This seems to work ok to serve css to Opera:
Code: if(history.navigationMode){
document.write('<link rel="stylesheet" type="text/css" href="opera.css">') }
Is there a way to use Code: @media screen and (-webkit-min-device-pixel-ratio:0){}
to serve css to Safari? ie, without having to use it on each tag in the main stylesheet? Tried Code: if(@media screen and (-webkit-min-device-pixel-ratio:0)){
document.write('<link rel="stylesheet" type="text/css" href="safari.css">') }
but I think it's missing an 'is true' phrase... ? and this one Code: if('@media screen' && '(-webkit-min-device-pixel-ratio:0)'){
document.write('<link rel="stylesheet" type="text/css" href="safari.css">')}
picks up Firefox and Opera as well. Similar TutorialsMy webpage won't load at all in Safari, unless I open it as a link from anbother site or if I manually type in the index.html after the url. when I take out the javascript though, it work perfectly. I always works in Firefox though. Any hints: <script type="text/javascript" src="stuff/x_core.js"></script><script type="text/javascript"> var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www."); document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E")); </script><script src="stuff/ga.js" type="text/javascript"></script> <script type="text/javascript"> try { var pageTracker = _gat._getTracker("UA-*******-*"); pageTracker._trackPageview(); } catch(err) {}</script> <script type="text/javascript"> var start_z_index = 3000; function bringtotop( item ) { item.style.zIndex = start_z_index++; } </script> <script type="text/javascript" src="stuff/x_event.js"></script> <script type="text/javascript" src="stuff/xenabledrag.js"></script> <script type="text/javascript" src="stuff/xenabledrag2.js"></script> Hi everyone, I have a javascript which used to delete object(s) when the "delete' button is clicked. The script is working fine on IE, but on Safari it do not wwork at all (when I click delete button the webpage stays the same). I think the reason is Safari is using a different javascript interpreter which cannot parse javascript developed in IE properly, such as "fireEvent". Please help me to fix the script for it to work on Safari. Here is the script: Code: function DeleteClick()
{
var frmSWO = document.getElementById("form");
var answer = confirm("Do you really want to delete?")
if (answer != 0)
{
frmSWO.action = "/domsWeb/mtd/doms/web/operation/controller/manageWorkOrder/DeleteJobOrImage.do";
frmSWO.method = "post";
this.form.fireEvent('onsubmit');
frmSWO.submit();
}
}
I do appreciate any help. I had a client specifically request that no matter the size of the browser he wants it to immediately enlarge to full screen onload of the flash site. I put this in the header: Code: <script type="text/javascript">
window.moveTo(0,0);
if (document.all) {window.resizeTo(screen.availWidth,screen.availHeight)}
else {window.outerHeight = screen.availHeight; window.outerWidth = screen.availWidth}
</script>
However, this specific code doesn't work in Safari on a mac. Is there any way I can make this compatible? the page in question is http://martysimpson.com In firefox search the source code for Code: <script language="javascript" type="text/javascript">
<!--
function submitacajoommod1(formname) {
var form = eval('document.'+formname);var place = form.email.value.indexOf("@",1);var point = form.email.value.indexOf(".",place+1);
if (form.name.value == "" || form.name.value == "Name") {
alert( "Please enter your name." );return false;
} else
if (form.email.value == "" || form.email.value == "E-mail") {alert( "Please enter a valid e-mail address." );return false;
} else {if ((place > -1)&&(form.email.value.length >2)&&(point > 1)){form.submit();return true;
} else {alert( "Please enter a valid e-mail address." );return false;}}}
//-->
</script><form action="http://martysimpson.com/component/acajoom/" method="post" name="modacajoomForm1">
I am on a mac using osx.4.11 firefox version 3.5 renders the above just fine. Safari version 3.04 just does not show the javascript at all which then makes the input fields on the sign-up for newsletter simply not show up. Any ideas? Hi all, The following script is scrolling my page smoothly, as it is supposed to, in IE and FF however it is not working at all in Safari, any version. The page is: www.christiantate.net When working correctly, you click the nav buttons in the left sidebar, the page scrolls to the appropriate section. The script: Code: $(function(){
$('a[href*=#]').click(function() {
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'')
&& location.hostname == this.hostname) {
var $target = $(this.hash);
$target = $target.length && $target || $('[name=' + this.hash.slice(1) +']');
if ($target.length) {
var targetOffset = $target.offset().top-100;
$('html,body').animate({scrollTop: targetOffset}, 1000);
return false;
}
}
});
});
Any help would be greatly appreciated. Thanks Ok, so I have multiple issues, but this is the one I have not been able to work around. I'm building a simple website for personal use, so I know it only has to work on Safari for the iPad, a simple catalog of song charts for use on stage in my piano bar. Everything works GREAT in Safari/Chrome for Windows 7, but doesn't seem to quite work on Safari for iPad. The issue I'm having is I've set up a DIV with two image buttons on it to execute a ScrollBy command to scroll the page up or down depending on the button. Everything works great on Safari for Windows 7, as in I can keep scrolling down the page by pressing the scroll down button multiple times. On iPad, it only works once, and will not continue to scroll. I've also tried it in Atomic Lite for iPad, with the same effect. I've mocked up a simple page, to take all the other variables out. http://www.duelingpianopiano.com/jef...testscroll.htm Eventually, I will be installing it he http://www.duelingpianopiano.com/jef...testscroll.htm The code in the head tag is below: <code> <script language="JavaScript" type="text/javascript"> <!-- Copyright 2003, Sandeep Gangadharan --> <!-- For more free scripts go to http://sivamdesign.com/scripts/ --> <!-- var y1 = 510; // change the # on the left to adjuct the Y co-ordinate (document.getElementById) ? dom = true : dom = false; function hideIt() { if (dom) {document.getElementById("layer1").style.visibility='hidden';} } function showIt() { if (dom) {document.getElementById("layer1").style.visibility='visible';} } function placeIt() { if (dom && !document.all) {document.getElementById("layer1").style.top = window.pageYOffset + (window.innerHeight - (window.innerHeight-y1)) + "px";} if (document.all) {document.all["layer1"].style.top = document.documentElement.scrollTop + (document.documentElement.clientHeight - (document.documentElement.clientHeight-y1)) + "px";} window.setTimeout("placeIt()", 10); } // --> </script> <script language="JavaScript"> function scrollup(){ parent.scrollBy(0,-window.innerHeight-50); } function scrolldown(){ parent.scrollBy(0,window.innerHeight-50); } </script> </code> The code from the body tag: <code> <body topmargin="00" leftmargin="0" rightmargin="0" bottommargin="0" marginwidth="0" marginheight="0" link="#FFFFFF" vlink="#FFFFFF" alink="#FFFF00" bgcolor="#FFFFFF" "overflow: visible" onLoad="placeIt(); showIt()"> INSERT CONTENT HERE <div id="layer1" style="position:absolute; right:0; width:50px; height:150px; visibility:hidden"> <font face="verdana, arial, helvetica, sans-serif" size="2"> <div style="float:left; background-color: ; padding:0px; border:0px solid black"> <img src="upbutton.png" width=50 height=75 border="0" align="left" onClick="scrollup();"> <img src="downbutton.png" width=50 height=75 border="0" align="left" onClick="scrolldown();"> </div> </code> Like I said, it works just as needed in Safari/Chrome for Windows 7, but not on iPad. Doesn't seem to work in IE 8, but that doesn't bother me. I have not tested in FireFox. Your ideas are much appreciated. I'm not an Apple person, so maybe there is a well known issue with scrollBy and Safari for iPad, that I'm not aware of. If that is the case, if anyone has an idea for a direction for a workaround that would be great as well. Eventually, I would like to use the smooth scrolling scripts that I've seen out there, but that is way down the road. I'm more worried about the functionality as is. hi, on my website: http://zend.warrencreative.com/gemini-group/index.html the carousel on the right is not showing unless you hover your mouse over?! Can some one please help? I am using : http://www.twospy.com/galleriffic/ I am reading/writing cookies to control which default page the user will land on. Works fine in FireFox, but on Safari, the cookie tends to stick and will not change. Here is my code: Code: // this function reads the pulldown menu's selected item, tells the cookie writing function which index number it is, then goes to that page.
function myJumpMenu(oSrc)
{
url = oSrc.options[oSrc.selectedIndex].value;
selectorIndex = oSrc.selectedIndex;
//alert(selectorIndex);
write_cookie(selectorIndex);
goNow();
}
//sets the default on the pulldown menu
function setDefault() {
document.forms[0].elements[0].selectedIndex=selectorIndex;
}
// Writes the cookie
// I get the right number on the first alert, but it doesn't change the cookie
//second alert gives me the old cookie value
//so if I chose "1" I'd get an alert of "1", but document.cookie alert says "language=5"
function write_cookie(lang) {
alert(lang);
document.cookie = "language=" + lang + "; expires=Wednesday, 01-Aug-2020 08:00:00 GMT";
alert(document.cookie);
}
Hello. When a user visits index.html on my site, they input their email address. The form redirects them to "confirmed.html", the form also writes a cookie with their email address. When the user gets to confirmed.html, I use an "if/else" statement. If there is a cookie (email address), I append ("#"+user_email) to the window location. I do this so that when the user shares with "addthis" tool, I will know who is sharing. Unfortunately addthis only shares the current page, so I want new users to the site to be redirected to index.html My code works in firefox, but not safari. In safari it just seems to redirect to index nomatter what. The user never even sees confirmed.html. Code: var user_email = unescape(document.cookie);
if (document.cookie)
{
window.location.replace("#"+user_email);
}
else {
window.location.replace("index.html");
}
})();
</script>
The website is www.saverally.com Hey all, I have a sentence generator running on a site. I am using sort to shuffle the array and pop to return the item. All is well, except Safari does not shuffle the array. Here is the technique I am using: Code: <script type = "text/javascript">
var adj=["invisible", "running", "eating", "mad", "talking", "jumping", "living", "weird", "super"];
for (i = 1; i <= 4; i++){
adj.sort(function(){return Math.round(Math.random());});
document.write( [
"Bob is" + " " + adj.pop() + "." + "<br>"
]);
}
</script>
In most browsers it generates 4 unique sentences. But in Safari it does not shuffle the array so it will always output: Bob is super. Bob is weird. Bob is living. Bob is jumping. Any ideas as to what is happening? Hello! I need a bit of help here, if possible. This code seems to work well with FireFox. It doesn't work so well with IE or Safari though. The onMouseOver event works properly (changes the bg-color and the bg-image) but the onMouseOut event doesn't work (it changes the bg-color back to normal but not the bg-image). I don't quite understand the problem. Code: <table cellspacing="0" cellpadding="0" width="230" height="20">
<tr>
<td class="font1" align="center" style="color:#2a78c6; background-color: #3c3c3c; background-image:url('images/nav-bg.png')" onclick="window.location.href='#'" cursor: pointer;
onMouseOver="this.style.color='c8c8c8'; this.style.backgroundColor='#2a78c6'; this.style.backgroundImage='url(images/nav-bg-hover.png)'"
onMouseOut="this.style.color='#2a78c6'; this.style.backgroundColor='#3c3c3c'; this.style.backgroundImage='url(images/nav-bg.png'">
LINK
</td>
</tr>
</table>
Here is the website... http://pmportfolio.net/tester/. Also can't figure out how to get that drop-down menu working for IE, if anyone can lend a hand. Also can't get the gradients to work with IE 8. Hi everyone, My page with my slideshow (with lightbox integrated) is up and running fine on browsers like Firefox, IE, and Google Chrome... But Safari doesn't even show the slideshow. www.bobbivanstudio.com/work.php Any ideas why? Thanks in advance! I've run into a glitch in my little calculator form. Apparently, in Safari, when you hit the enter key while the cursor is in an input field, it will attempt to submit the form. I don't want this to happen. Submitting serves no purpose in this, because all of the functionality is in the script on the page. I copied most of the HTML from an example, and noted that the form tag didn't contain an action= parameter. I tried adding this with the hopes that it would override Safari's default submit action. They do affect its behavior, but not in a way that does any good. First, I tried: action="" which didn't work Then, I tried: action="CalcRange()" This is a harmless function that normally runs on field change. It didn't work either. In every case Safari is determined to fire off a URL. No problems with MSIE or Firefox. Is there another way of using the action parameter to fix the problem, or do I have to attack this another way. Thanks. Code: <html><head><title></title>
<script language="JavaScript">
var d = null;
function PadCalc(ctrm,cvlo,cvhi,cstray,rc) {
chp = cvhi+ctrm;
clp = cvlo+ctrm;
beta=(rc-1)*cstray;
a=rc* clp- chp +beta;
b= (rc-1)*clp*chp+beta*(clp + chp);
c=beta*clp* chp;
cser=(-b-Math.sqrt(b*b-4*a*c))/(a+a);
return(cser);
}
function TrmCalc(cser,cvlo,cvhi,cstray,rc) {
if (cser<0.00001) {
ctrm=(cvhi+cstray-rc*(cvlo+cstray))/(rc-1);
}
else {
cser2=cser*cser;
k0=(1-rc)*cstray;
k1=k0*cser2;
k2=k0*cser+cser2;
k3=k0*cser-rc*cser2;
k4=k0+(1-rc)*cser;
a=k4;
b=k2+k3+k4*(cvlo+cvhi);
c=k1+k2*cvhi+k3*cvlo+k4*cvlo*cvhi;
ctrm=(-b-Math.sqrt(b*b-4*a*c))/(a+a);
}
return(ctrm);
}
function setCellTxt(id,tx,clr){
cell=document.getElementById(id);
cell.innerHTML=tx;
cell.style.color=clr;
}
function CalcAll() {
setCellTxt("ex_cpar","***","#FF0000");
setCellTxt("ex_cser","***","#FF0000");
setCellTxt("ex_L","***","#FF0000");
flo = parseFloat(d.ef_flo.value);
fhi = parseFloat(d.ef_fhi.value);
cvlo = parseFloat(d.ef_cvlo.value);
cvhi = parseFloat(d.ef_cvhi.value);
cstray = parseFloat("0".concat(d.ef_cstray.value));
KVal = parseFloat(d.ef_KVal.value);
spi = 500000.0/Math.PI;
rf=fhi/flo;
rc=rf*rf;
switch(d.mknown.selectedIndex){
case 0:
// For Given inductor
L = KVal;
w=(spi/flo)
chppp = w*w/L;
w=(spi/fhi)
clppp = w*w/L;
alpha = cstray-chppp;
beta = cstray-clppp;
k1 = cvhi-chppp-cvlo+clppp;
k2 = alpha - beta;
k3 = alpha*cvhi - beta*cvlo;
k4 = alpha*cvhi;
k5 = cvhi + alpha;
a = -k2/k1;
b = alpha-(k3+k2*k5)/k1;
c = k4-(k3*k5)/k1;
ctrm = (-b+Math.sqrt(b*b-4*a*c))/(a+a);
cser = -(k2*ctrm+k3)/k1;
if (cser>100*cvhi) cser=0;
// End of given L calc
break;
case 1:
// For Given Padder
cser=KVal;
if (cser<.00001) {
cpinv=0;
}
else {
cpinv=1/cser;
}
ctrm=TrmCalc(cser,cvlo,cvhi,cstray,rc);
chp=cvhi+ctrm;
chppp=1/(1/chp+cpinv)+cstray;
w=spi/flo;
L=w*w/chppp;
break;
case 2:
// For Given Trimmer
ctrm=KVal;
cser=PadCalc(ctrm,cvlo,cvhi,cstray,rc);
chppp=chp*cser/(chp+cser)+cstray;
if (cser>100*cvhi) cser=0;
w=spi/flo;
L=w*w/chppp
break;
}
badVal=false;
if (isNaN(ctrm) || ctrm<0) badVal=True;
if (isNaN(cser) || cser <0) badVal=True;
if (isNaN(L) || L<0) badVal=True;
if (!badVal) {
setCellTxt("ex_cpar",ctrm.toFixed(2),"#000080");
setCellTxt("ex_cser",cser.toFixed(2),"#000080");
setCellTxt("ex_L",L.toFixed(2),"#000080");
}
}
function CalcRange() {
flo = parseFloat(d.ef_flo.value);
fhi = parseFloat(d.ef_fhi.value);
cvlo = parseFloat(d.ef_cvlo.value);
cvhi = parseFloat(d.ef_cvhi.value);
cstray = parseFloat("0".concat(d.ef_cstray.value));
if (flo>0 && fhi>0 && cvlo>0 && cvhi>0) {
spi = 500000.0/Math.PI;
rf=fhi/flo;
rc=rf*rf;
csmin=PadCalc(0,cvlo,cvhi,cstray,rc);
ctmax=TrmCalc(0,cvlo,cvhi,cstray,rc);
w=spi/flo
chppp=cvhi*csmin/(cvhi+csmin)+cstray;
Lmax=w*w/chppp;
chppp=cvhi+ctrm+cstray;
Lmin=w*w/chppp;
//Reset exact calc outputs after input parameter change
/*
setCellTxt("ex_cpar","","#000080");
setCellTxt("ex_cser","","#000080");
setCellTxt("ex_L","","#000080");
*/
if (Lmin<0 || Lmax<0 || ctmax<0 || csmin<0) {
setCellTxt("rTrm","***","#FF0000");
setCellTxt("rPad","***","#FF0000");
setCellTxt("rInd","***","#FF0000");
}
else {
setCellTxt("rTrm","0 ... ".concat(ctmax.toFixed(2)),"#000080");
setCellTxt("rPad",">= ".concat(csmin.toFixed(2)," (if present)"),"#000080");
setCellTxt("rInd","".concat(Lmin.toFixed(2)," ... ",Lmax.toFixed(2)),"#000080");
}
}
}
function kvChange() {
descriptions = Array ("Enter Inductance Value (µH):","Enter Series Capacitance Value (pF):","Enter Parallel Capacitance Value: (pF)");
setCellTxt("KVdescription",descriptions[d.mknown.selectedIndex],"#000080");
setCellTxt("ex_cpar","","#000080");
setCellTxt("ex_cser","","#000080");
setCellTxt("ex_L","","#000080");
}
</script>
</head>
<body onload="d = document.forms[0];">
<center>
<h2>Bandspread Calculator</h2>
</center>
<form >
<table style="width: 692px; height: 400px;" align="center"
border="0">
<tbody>
<tr>
<td align="center" colspan=2"><B>Input Parameters:</B></td>
</tr>
<tr>
<td align="right">Lowest Frequency (kHz):</td>
<td><input name="ef_flo" onchange="CalcRange()" size="18"> </td>
</tr>
<tr>
<td align="right">Highest Frequency (kHz):</td>
<td><input name="ef_fhi" onchange="CalcRange()" size="18"> </td>
</tr>
<tr>
<td align="right">Tuning Capacitor <I>C<sub>V</sub></I> Minimum Capacitance (pF):</td>
<td><input name="ef_cvlo" onchange="CalcRange()" size="18"> </td>
</tr>
<tr>
<td align="right">Tuning Capacitor <I>C<sub>V</sub></I> Maximum Capacitance (pF):</td>
<td><input name="ef_cvhi" onchange="CalcRange()" size="18"> </td>
</tr>
<tr>
<td align="right">Stray Capacitance <I>C<sub>S</sub></I> (pF):</td>
<td><input name="ef_cstray" onchange="CalcRange()" size="18"> </td>
</tr>
<tr>
<td align="center" colspan=2"><HR></td>
</tr>
<tr>
<td align="center" colspan=2"><B>Allowable Component Ranges:</B></td>
</tr>
<tr>
<td align="right">Trimmer Capacitor <I>C<sub>T</sub></I> (pF): </td>
<td align="left" id="rTrm"><font color="#FF0000">***</font></td>
</tr>
<tr>
<td align="right">Padder Capacitor <I>C<sub>P</sub></I> (pF): </td>
<td align="left" id="rPad" ><font color="#FF0000">***</font></td>
</tr>
<tr>
<td align="right">Inductor (µH): </td>
<td align="left" id="rInd"><font color="#FF0000">***</font></td>
</tr>
<tr>
<td align="center" colspan=2"><HR></td>
</tr>
<tr>
<td align="center" colspan=2"><B>Exact Value Calculation:</B></td>
</tr>
<tr>
<td align="right">Choose the Known Component:</td>
<td>
<select name="mknown" onchange="kvChange()" size="1">
<option selected="selected">Inductor</option>
<option>Padder Capacitor (Series)</option>
<option>Trimmer Capacitor (Parallel)</option>
</select>
</td>
</tr>
<tr>
<td id="KVdescription" align="right">Enter the Known Component Value:</td>
<td><input name="ef_KVal" size="18"></td>
</tr>
<tr>
<td align="right">Click to Calculate the Unknown Components:</td>
<td><input type="button" value="Calculate" onclick="CalcAll()"> </td>
</tr>
<tr>
<td align="right">Trimmer Capacitor <I>C<sub>T</sub></I> (pF): </td>
<td id="ex_cpar" > </td>
</tr>
<tr>
<td align="right">Padder Capacitor <I>C<sub>P</sub></I> (pF): </td>
<td id="ex_cser"> </td>
</tr>
<tr>
<td align="right">Inductor (µH): </td>
<td id="ex_L"> </td>
</tr>
</tbody>
</table>
</form>
</body></html>
Edit: I should also add that my web page is made using Apple's iWeb software, and it stores the above code in a separate file, and then uses the following iframe code to load it: Code: <iframe id="widget1-frame" src=".//BandspreadCalc_files/widget1_markup.html" frameborder="0" style="width: 100%; height: 100%;" scrolling="no" marginheight="0" marginwidth="0" allowTransparency="true"></iframe> So, when Safari submits the form, the result is that it loads a page containing only the widget1_markup.html code, and not the parent page. Either way, it's annoying, because any data that the user has entered in a field will be erased. My page is working as I want it to in firefox and IE. well almost fully in IE... Anyways at the top of my page I am using an fx.slide that does not work at all in safari or chrome and was wondering if anyone here could shed some light as to why? here is the page in question Any help would be great. Thanks so much. Can someone help me figure out why these two scripts conflict in Firefox and Safari? They work fine in Internet Explorer, and they work fine in ALL browsers when they don't have to work together on the same page. When they both need to work on the same page, it's the div/column resize script that is acting up in Safari and Firefox (again, it works fine in IE). What's really strange is that when I click on my firebug icon (in the lower righthand corner) in Firefox the divs/columns resize like they should and everything looks fine. It's almost as if it's not resizing in real time like it should be, and something about me clicking that icon is making it refresh or update or something. Any help given with this matter would be greatly appreciated! Resize two Divs (columns) to be the same height: Code: // Replace 'center' 'right' and 'left' with the ID names of the columns you want to balance.
// The last one is there to show how you can add more columns. Just delete the ones you're not using.
var divs = new Array('col1, 'col2');
// Initialize Scripts - is this a browser that understands DOM?
function scriptInit() { if (!document.getElementById) { return; } }
// Set up Event Listener
function addEvent(elm, evType, fn, useCapture) {
if (elm.addEventListener) { elm.addEventListener(evType, fn, useCapture); return true; }
else if (elm.attachEvent) { var r = elm.attachEvent('on' + evType, fn); return r; }
else { elm['on' + evType] = fn; }
}
// Start Column Script
function setTall() {
if (document.getElementById) { var maxHeight = 0; for (var i = 0; i < divs.length; i++) {
if (document.getElementById(divs[i]) != null)
{ var div = document.getElementById(divs[i]); div.style.height = null; if (div.offsetHeight > maxHeight) maxHeight = div.offsetHeight; }
}
for (var i = 0; i < divs.length; i++) {
if (document.getElementById(divs[i]) != null)
{ var div = document.getElementById(divs[i]); div.style.height = maxHeight + 'px'; if (div.offsetHeight > maxHeight) { div.style.height = (maxHeight - (div.offsetHeight - maxHeight)) + 'px'; } }
}
}
}
// Assign one of the columns to the TextResizeDetector.
function initTall() {
if (document.getElementById) { for (var i = 0; i < divs.length; i++)
{ if (document.getElementById(divs[i]) != null) { TextResizeDetector.TARGET_ELEMENT_ID = divs[i]; break; } }
setTall(); }
}
// Fire Events
addEvent(window, 'load', initTall, false);
addEvent(window, 'resize', setTall, false);
/* Detects changes to font sizes when user changes browser settings
Fires a custom event with the following data:
iBase : base font size
iDelta : difference in pixels from previous setting
iSize : size in pixel of text
author Lawrence Carvalho carvalho@uk.yahoo-inc.com */
// @constructor
TextResizeDetector = function() {
var el = null;
var iIntervalDelay = 200;
var iInterval = null;
var iCurrSize = -1;
var iBase = -1;
var aListeners = [];
var createControlElement = function() {
el = document.createElement('span');
el.id='textResizeControl';
el.innerHTML=' ';
el.style.position="absolute";
el.style.left="-9999px";
var elC = document.getElementById(TextResizeDetector.TARGET_ELEMENT_ID);
// insert before firstChild
if (elC)
elC.insertBefore(el,elC.firstChild);
iBase = iCurrSize = TextResizeDetector.getSize();
};
function _stopDetector() {
window.clearInterval(iInterval);
iInterval=null;
};
function _startDetector() {
if (!iInterval) {
iInterval = window.setInterval('TextResizeDetector.detect()',iIntervalDelay);
}
};
function _detect() {
var iNewSize = TextResizeDetector.getSize();
if(iNewSize!== iCurrSize) {
for (var i=0;i <aListeners.length;i++) {
aListnr = aListeners[i];
var oArgs = { iBase: iBase,iDelta:((iCurrSize!=-1) ? iNewSize - iCurrSize + 'px' : "0px"),iSize:iCurrSize = iNewSize};
if (!aListnr.obj) {
aListnr.fn('textSizeChanged',[oArgs]);
}
else {
aListnr.fn.apply(aListnr.obj,['textSizeChanged',[oArgs]]);
}
}
}
return iCurrSize;
};
var onAvailable = function() {
if (!TextResizeDetector.onAvailableCount_i ) {
TextResizeDetector.onAvailableCount_i =0;
}
if (document.getElementById(TextResizeDetector.TARGET_ELEMENT_ID)) {
TextResizeDetector.init();
if (TextResizeDetector.USER_INIT_FUNC){
TextResizeDetector.USER_INIT_FUNC();
}
TextResizeDetector.onAvailableCount_i = null;
}
else {
if (TextResizeDetector.onAvailableCount_i<600) {
TextResizeDetector.onAvailableCount_i++;
setTimeout(onAvailable,200)
}
}
};
setTimeout(onAvailable,500);
return {
/*
* Initializes the detector
*
* @param {String} sId The id of the element in which to create the control element
*/
init: function() {
createControlElement();
_startDetector();
},
/**
* Adds listeners to the ontextsizechange event.
* Returns the base font size
*
*/
addEventListener:function(fn,obj,bScope) {
aListeners[aListeners.length] = {
fn: fn,
obj: obj
}
return iBase;
},
/**
* performs the detection and fires textSizeChanged event
* @return the current font size
* @type {integer}
*/
detect:function() {
return _detect();
},
/**
* Returns the height of the control element
*
* @return the current height of control element
* @type {integer}
*/
getSize:function() {
var iSize;
return el.offsetHeight;
},
/**
* Stops the detector
*/
stopDetector:function() {
return _stopDetector();
},
/*
* Starts the detector
*/
startDetector:function() {
return _startDetector();
}
}
}();
/*** end TextResizeDetector */
TextResizeDetector.TARGET_ELEMENT_ID = 'doc';
TextResizeDetector.USER_INIT_FUNC = function() {
var iBase = TextResizeDetector.addEventListener(setTall, null);
};
Click link to show hidden text: Code: function expand(ele) {
if (document.getElementById('answer'+ele).style.display == '')
document.getElementById('answer'+ele).style.display='none';
else
document.getElementById('answer'+ele).style.display='';
for (i=0;i <= 75;i++) {
if (document.getElementById('answer'+i) != null && i != ele) document.getElementById('answer'+i).style.display='none';
}
}
function collapse(ele) {
document.getElementById('answer'+ele).style.display='none';
}
anyone else have issues with their code messing up their page view-ability in Safari on a Mac? thanks! Code:
function toggle(div_id) {
var el = document.getElementById(div_id);
if ( el.style.display == 'none' ) { el.style.display = 'block';}
else {el.style.display = 'none';}
}
function blanket_size(popUpDivVar) {
if (typeof window.innerWidth != 'undefined') {
viewportheight = window.innerHeight;
} else {
viewportheight = document.documentElement.clientHeight;
}
if ((viewportheight > document.body.parentNode.scrollHeight) && (viewportheight > document.body.parentNode.clientHeight)) {
blanket_height = viewportheight;
} else {
if (document.body.parentNode.clientHeight > document.body.parentNode.scrollHeight) {
blanket_height = document.body.parentNode.clientHeight;
} else {
blanket_height = document.body.parentNode.scrollHeight;
}
}
var blanket = document.getElementById('blanket');
blanket.style.height = blanket_height + 'px';
var popUpDiv = document.getElementById(popUpDivVar);
popUpDiv_height=200
popUpDiv.style.top = popUpDiv_height + 'px';
}
function window_pos(popUpDivVar) {
if (typeof window.innerWidth != 'undefined') {
viewportwidth = window.innerHeight;
} else {
viewportwidth = document.documentElement.clientHeight;
}
if ((viewportwidth > document.body.parentNode.scrollWidth) && (viewportwidth > document.body.parentNode.clientWidth)) {
window_width = viewportwidth;
} else {
if (document.body.parentNode.clientWidth > document.body.parentNode.scrollWidth) {
window_width = document.body.parentNode.clientWidth;
} else {
window_width = document.body.parentNode.scrollWidth;
}
}
var popUpDiv = document.getElementById(popUpDivVar);
window_width=window_width/2-150;//150 is half popup's width
popUpDiv.style.left = window_width + 'px';
}
function popup(windowname) {
blanket_size(windowname);
window_pos(windowname);
toggle('blanket');
toggle(windowname);
}
I have know much about javascript, but the code above works fine in safari and firefox but not IE. it's for a popup, when you click a link it blankets the page and theres a popup window. here's other parts of supporting css/php Code:
<?php
if(!$_POST['submit'] == 'login'){
echo "<div id=\"blanket\" style=\"display:none;\"></div>\n";
echo "<div id=\"popUpDiv\" style=\"display:none;\">\n";
echo "<div id=\"loginform\">\n";
echo '<div id="close">';
echo "<a href=\"#\" onclick=\"popup('popUpDiv')\">\n";
echo '<img src="images/login/close.png" border="0">';
echo "</a>\n";
echo '</div>';
echo '<div class="clear"></div>';
echo "<form name=\"login\" method=\"post\" action=\"#\">\n";
echo "<div id=\"usernametext\">Username</div>\n";
echo "<input name=\"username\" type=\"text\" id=\"usernameinput\">\n";
echo '<div class="clear"></div>';
echo "<div id=\"passwordtext\">Password</div>\n";
echo "<input name=\"password\" type=\"password\" id=\"passwordinput\">\n";
echo '<div class="clear"></div>';
echo '<div id="loginsubmit"><input type="submit" name="submit" value="Submit"></div>';
echo "</form>\n";
echo "</div>\n";
echo "</div>\n";
echo "<span class=\"login_text\"><a href=\"#\" onclick=\"popup('popUpDiv')\">LOG IN</a></span>\n";
?>
Code:
#blanket {
background-color:#000000;
opacity: 0.40;
filter:alpha(opacity=40);
position:absolute;
z-index: 10;
padding:0;
top:0;
right:0;
left:0;
bottom:0;
width:100%;
height:100%;
margin:0 0 0 0;
}
#popUpDiv {
position:absolute;
background-color:#FFFFFF;
width:280px;
height:135px;
z-index: 10;
}
any help would be VERY much appreciated. thanks Hello all, I'm back with more silly newbie questions. I'm building a website that includes 3 javascript codes: 1. Onmouseover image switch for the nav bar. 2. On a specific page, onmouseover display of hidden divs. 3. Particletree's Dynamic Resolution Dependent Layout script (http://particletree.com/features/dyn...ndent-layouts/) All three scripts work fine in firefox, but the 2nd script doesn't work in safari and chrome, and the 3rd one doesn't work in safari, chrome and IE(8). Since the 1st one works fine in all browsers, I'm guessing this isn't a problem with my javascript link or anything like that. The website is: www.sheket.co.il/index4.html The specific page that runs the 2nd code is: www.sheket.co.il/services.html My javascript is: http://www.sheket.co.il/javascript.js And my default stylesheet is: http://www.sheket.co.il/style.css (I apologize for possible jibrish- the website is in Hebrew...) Any help with these two problems would be greatly appreciated! Hi everyone, While designing my www I used the tab view script made by Lyubinskiy found on javascript kit www. It works brilliant on mozzila and chrome. However when I tried on safari and IE, the tabs don't work. Can anyone tell me how should I adjust the sript for it to work on IE and Safari? Code: function tabview_aux(TabViewId, id)
{
var TabView = document.getElementById(TabViewId);
// ----- Tabs -----
var Tabs = TabView.firstChild;
while (Tabs.className != "Tabs" ) Tabs = Tabs.nextSibling;
var Tab = Tabs.firstChild;
var i = 0;
do
{
if (Tab.tagName == "A")
{
i++;
Tab.href = "javascript:tabview_switch('"+TabViewId+"', "+i+");";
Tab.className = (i == id) ? "Active" : "";
Tab.blur();
}
}
while (Tab = Tab.nextSibling);
// ----- Pages -----
var Pages = TabView.firstChild;
while (Pages.className != 'Pages') Pages = Pages.nextSibling;
var Page = Pages.firstChild;
var i = 0;
do
{
if (Page.className == 'Page')
{
i++;
if (Pages.offsetHeight) Page.style.height = (Pages.offsetHeight-2)+"px";
Page.style.overflow = "auto";
Page.style.display = (i == id) ? 'block' : 'none';
}
}
while (Page = Page.nextSibling);
}
// ----- Functions -------------------------------------------------------------
function tabview_switch(TabViewId, id) { tabview_aux(TabViewId, id); }
function tabview_initialize(TabViewId) { tabview_aux(TabViewId, 1); }
thanks for any suggestions Hello, Im testing the use of document.write and Im having trouble making a link work in Safari Code: document.write('<a href="index.htm"><img src="./images/portrait2.png"></a>');
This works in FF and IE9 but not in Safari (nor in Chrome), In Safari I see the portrait just fine but the cursor doesnt change when overing the image and clicking on it doesnt activate the link. What is the correct way to write this line? I have tried this and it also doesnt work in Safari and Chrome: Code: document.write("<a href='index.htm'><img src='./images/portrait2.png'></a>");
thanks for any insight |
|||||||