JavaScript - Need Help! Js Not Work On 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.

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?

My 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, 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/

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. 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

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.

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 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

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,

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

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

Hi,

I have a login script which is working in IE but not firefox or safari. I was hopoing someone might be able to point me in the right direction as i'm at a loss as to why it isn't working

My login form looks like this

Code:

<?php
	session_start();
	include_once("inc.php");
    $wlog='not';
	$msm_error='';
	if (isset($_GET['wlog']))
	{
		$wlog=$_GET['wlog'];
		if($wlog =='out' or $wlog =='not')
		{
			global $HTTP_SESSION_VARS;
			unset($HTTP_SESSION_VARS['client']);
		}
		if($wlog =='not')
		{
			$msm_error='<h1 style="color:#CC0000">Username or Password is incorrect</h1>';
		}
	}else{
	
		$wlog=$_GET['wlog'];
	}

	$cms=check_login_status();

	$show_cat=0;
	$show_cat_sub=0;
	$brand=0;
	$p_size=0;
	$color=0;
	$r_price=0;
	$status=0;
?>

function client_login_signup_form($wlog,$msm_error)
{
	if($wlog =='out')
	{
		global $HTTP_SESSION_VARS;
		unset($HTTP_SESSION_VARS['client']);
	}
?>


<form name='Formlogin' id='Formlogin' method='post' action='check_user.php'  onSubmit='return clientvalidate();'> 
<input type='hidden' name='wlog' id='wlog' value='<?php echo $wlog; ?>'/>
        <div id='logmsm'><?php echo $msm_error; ?></div>
        <h1>Existing Customer - Login</h1>
        <p style='color:#fdca00'>Please enter your email address and password</p>
<table width='100%' border='0' cellspacing='2' cellpadding='2'>
          <tr>
            <td width="20%" align='left'><p>Email Address:&nbsp;</p></td>
            <td width="80%" ><input name='e_mail' type='text' class="input1" id='e_mail' /></td>
          </tr>
          <tr>
            <td align='left'><p>Password:&nbsp;</p></td>
            <td><input name='pass' type='password' class='input1' id='pass' /></td>
          </tr>
          <tr>
            <td>&nbsp;</td>
            <td><input name='submit' type='submit' value='Submit' /></td>
          </tr>
          <tr>
            <td colspan="2"><p style="margin-top:5px; font-size:10px"><a href="forgotten_password.php">Forgot your password ?</a></p></td>
          </tr>
        </table>
</form> 
<?php
}

My Javascript validation looks like this

Code:

function clientvalidate()
{
	//alert('user')
	if (document.Formlogin.e_mail.value=="")
	{
		alert("Please fill the E-mail.")
		document.Formlogin.e_mail.focus()
		return false
	}else{
		var user=document.Formlogin.e_mail.value;
			
	}
		
	if (document.Formlogin.pass.value=="")
	{
		alert("Please fill the password.")
		document.Formlogin.pass.focus()
		return false
	}else{
		var str=document.Formlogin.pass.value
		var v2=replacewithreg(str)
		if(v2==false)
		{
			document.Formlogin.pass.focus();
			return false;
		}else{

			var pass=document.Formlogin.pass.value;
			
		}
	}

	

	var wlog=document.Formlogin.wlog.value;

	url='ajax_check_client_login.php?user='
	url =url+user
	url += '&';
	url += 'pass=';
	url =url+pass;
	url += '&';
	url += 'wlog=';
	url =url+wlog;	
	//alert(url)

	javascript:void(0);
	new Ajax.Updater('', url);
	//updateaccountlink();
			
return true
}

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='&nbsp;';
		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';	
}

Ok I have tried and tried and cannot get this code to work in safari or google chrome.

Basically I am working on a shopping cart. The user will click the paypal pay now button. The form is submitted to paypal via a new window target="_blank"

I also need to refresh the current page. This will write shopping cart data to DB via php upon page refresh.

Safari and google Chrome will open the paypal window, but seems to ignore the javascript to refresh the browser.

FF and IE both work fine.
Code:

<script LANGUAGE="JavaScript">
function newPage() {
self.location.href=\'https://www.artists2you.com/s/orderconfirm.php?ordernumber='.$_SESSION['ordernumber'].'\';
}
</script>

Code:

<form action="https://www.sandbox.paypal.com/cgi-bin/webscr" method="post" target="_blank"" onSubmit=\'newPage()\'>