|
JavaScript - Pop-up Window Script For Website
Hi everyone. For few days I'm looking for how to do this pop-up script when the website is full loaded and then it appears with a darker screen like in this link: http://www.magesy.eu/ - you can see what i'm talking about.
But I want to customize it with my own design and functions. There is anyway on the net I can see a guide how to do it!? Thanks for all the helps! Similar TutorialsI have a script that works in seamonkey(my html editor) but when I use it in IE8 it says errors happen. Here's the code (the first line is on line 7 of the html file): Code: <script type="text/javascript">
function enlarge(imageNum)
{
var numToString = "";
if(parseInt(imageNum) < 10){
numToString = "0" + imageNum;
}
else
{
numToString = imageNum + "";
}
window.open("images/LgScreenshot"+numToString+".jpg","Screenshot "+imageNum,"status=0,height=675,width=900,resizable=0");
}
</script>
And the errors: Webpage error details User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.0; Trident/4.0; GTB0.0; SLCC1; .NET CLR 2.0.50727; Media Center PC 5.0; .NET CLR 3.5.30729; InfoPath.3; .NET CLR 3.0.30729) Timestamp: Wed, 10 Feb 2010 14:58:16 UTC Message: Object expected Line: 150 Char: 1 Code: 0 URI: http://samssc2site.co.cc/Features.html Message: Invalid argument. Line: 18 Char: 1 Code: 0 URI: http://samssc2site.co.cc/Features.html Hi, I'm wanting to create a pop-up window that shows upon entering on the website with two buttons that have different functions. I'm wanting the first button, when clicked, stops the message from appearing again. -Similar to the "do not show again" option that uses cookies from this thread.. http://codingforums.com/showthread.php?t=173115 And the second button, when clicked, redirects the user to a URL Is it as simple as using the code from the thread above and some simple javascript buttons? Thanks in advance, Haydn hi all, ok, i have been asked to alter our project management system (one i wrote) to alert users to the fact that they are closing windows with unsaved work in - some of them forget they have edited a page and just close the window. Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
var docChanged = false;
function docChange(){
docChanged = true;
}
function checkForChanges() {
if(docChanged == true) {
return "All changes made to this page will be lost!";
}
}
window.onbeforeunload = checkForChanges;
</script>
</head>
<body>
<form id="form1" name="form1" method="post" action="">
<label>
<input type="text" name="one" id="one" onchange="docChange()" />
</label>
<label>
<input type="text" name="two" id="two" onchange="docChange()" />
</label>
<br />
<a href='http://www.google.com'>Google</a>
</form>
</body>
</html>
the above will prompt the user if they want to save if fields etc have been changed. is there a way i can dynimcally add the onchange="docChange()" to all fields on a page? the system has hundreds of fields and doing a mass search and replace might be very dangerous lol. im pretty sure it can be done but wouldnt know where to start. ive never really had enough time to learn all the window.addEventListener stuff. Hi All Is is possible to 'Refresh' a script when the browser window is resized? I know how to execute a script using the (window).resize event but I effectively need to 'destroy' the initial instance and re-load it. This must be acheived without refreshing the browser If it helps I'm using the SmoothDivScroll plugin which has a known bug whereby widths aren't recalculated when the window is resized. The script stops working untill the browser is restored to it's initial width and unfortunately I don't have the expertise to fix that All help appreciated Cheers Craig Hi! everyone. I've run into a problem with a piece of script and being code illiterate I could use some help. I'm making a page with a few thumbnails that I want to use as links to open a larger image in a pop-up window. I found this piece of code ( call it a senior moment ~ but I didn't make a note of where it was ) that works fine in Firefox and Safari, but IE8 is telling me that there is an error in the highlighted line: Code: <script language="JavaScript">
function openW(mypage,myname,w,h,features) {
if(screen.width){
var winl = (screen.width-w)/2;
var wint = (screen.height-h)/2;
}else{winl = 0;wint =0;}
if (winl < 0) winl = 0;
if (wint < 0) wint = 0;
var settings = 'height=' + h + ',';
settings += 'width=' + w + ',';
settings += 'top=' + wint + ',';
settings += 'left=' + winl + ',';
settings += features;
win = window.open(mypage,myname,settings);
win.window.focus();
}
</script>
Code: <a href="JavaScript:openW('URL','TITLE',WIDTH,HEIGHT,'')">LINK</a>
Anyone got an idea if it can be tweaked to make IE recognize it? Or a simple alternative script that works cross browser? Any help would be greatly appreciated. Thanks How can I make a link or banner to be hidden after x clicks on it? And if possible to count only different IP clicks? Like if 30 users click on the banner and it is no longer shown in the site, unless I put some more clicks for it. Can you please help me, I will really appreciate this.
Hi , I have a Parent window and an URL embeded in the page. When I click the url for the first time it should launch the page in new window and when I click the link again from my parent window, the child window should not be refreshed and it should maximise. Can some one help me on this? -Harry The following script will take the option parameter from the page URL and scroll the page to the element which has the matching ID. For example: mypage.html?element3 will cause it to scroll to the element which has an id="element3" when the page loads. Code: <html><head><title></title>
<script type="text/javascript">
function OptionScroll(){
if (location.search.length > 0){
LocnId=unescape(location.search.substring(1))
scrollLocn = document.getElementById(LocnId).offsetTop
document.body.scrollTop = scrollLocn
}
}
</script>
</head>
<body onload="OptionScroll()">
...etc....
This works fine. Now for the next step, I want to be able to do this from a script embedded in an iframe. In other words, when the page loads, the iframe will load and a script within the iframe executes taking the parameter from the parent page's URL, and then scrolls the parent page to the element with the matching ID. Is it possible to do this? How can i run a script after the window.open loads completely?
Hi guys i want to make my javascript open the link in the same window instead of opening up i new tab, i know this should be basic but for some reason i can't figure it out, ill post the code below, thanks Code: for (var i=0; i <UN.length; i ++) {
if (( UN[i].toLowerCase() == uname.toLowerCase() ) && (PW[i] == pword)) {
alert ("User name and password matched!");
valid = true;
window.open('http://www.google.com');
Hello all,I have a website and I would like a pop-up window to promote a new website venture I have. I would like for the new website to open in a completely new window/browser when my members simply click on the index page (No link or Buttons).The code below does most of what I ask lol,but it.. 1.Only opens in a new tab (in same browser) while I would like for it to open in a completely new browser "full page" menu bar scroll tab and all. plus 2.It seems to open each and every time the page is clicked,which will be annoying to my members.I would only like for it to open 1 time per visitor every 24 hours or whenever cookies are cleared. Code: <html>
<head>
<script type="text/javascript">
function click_on()
{
window.open("URL HERE", "_blank");
}
</script>
</head>
<body onclick="click_on()">
</body>
</html>
I am no expert at this,and my knowledge is very limited,so excuse me if this is a simple situation.Any help would be greatly appreciated. Thanks, Roco Hello, I have to print my cell phone call records but unfortunately my wireless provider displays the number I called only when mouse is hovered over Call details. I have 470 call records and copy pasting all those numbers when mouse is hovered over it will be one hell of a task. Is there any way I could save all the information related to Called Number and do not have to move my mouse for each and every number? Using my basic programming understanding (Though I know nothing about javascript), they are using some mouseover function that displays this information. The possibility of this information to be on the server is less because this information is even available when I switch off my wireless. I can paste that portion of the code if someone needs it to help me out. Saving this website using normal "Save as" does not save the required information. Is there any other way I can save this website will all its details or somehow disabling this mouseover function so that call details are not hidden anymore. Regards, Scoobydoo woundering if any could point me in the right direction, where i can find a soul tree canculator script or any one who can make one. thanks shaun. Hey there! I'm having a bit of a problem with this site I'm workin' on... I am trying to incorporate a website slider (http://tympanus.net/codrops/2010/06/...g-with-jquery/), so when you click the links in my naviagtion, it slides right (horizontally) to a new page, however, with the slider/scroller script in there, the navigation stops working! Here is the link to this page and my code: http://goatsy.me/motoring/ Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="description" content="Website Horizontal Scrolling with jQuery" />
<meta name="keywords" content="jquery, horizontal, scrolling, scroll, smooth"/>
<link rel="stylesheet" href="css/style.css" type="text/css" media="screen"/>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>High Style Motoring - Scooters, Pit Bikes, Atv's, Mopeds, Parts and more!</title>
<link rel="stylesheet" href="example/css/website.css" type="text/css" media="screen"/>
<!--[if lte IE 6]>
<style type="text/css">
/* Internet Explorer 6 PNG transparency fix */
#rotatescroll .overlay { background: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="example/images/bg-rotatescroll.png", sizingmethod='scale'); }
#rotatescroll .thumb { background: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="example/images/bg-thumb.png", sizingmethod='scale'); }
</style>
<![endif]-->
<script type="text/javascript" src="example/js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="example/js/jquery.tinycircleslider.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#rotatescroll').tinycircleslider({ interval: true, snaptodots: true });
});
</script>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="description" content="Awesome Bubble Navigation with jQuery" />
<meta name="keywords" content="jquery, circular menu, navigation, round, bubble"/>
<link rel="stylesheet" href="css/style.css" type="text/css" media="screen"/>
<style>
*{
margin:0;
padding:0;
}
body{
font-family: "Trebuchet MS", sans-serif;
background:#fff url(images/bg_scoot1.png) no-repeat top left;
padding:20px;
}
.title{
width:548px;
height:169px;
position:absolute;
top:300px;
left:300px;
background:transparent url(title.png) no-repeat top left;
}
a.back{
background:transparent url(back.png) no-repeat top left;
position:fixed;
width:150px;
height:27px;
outline:none;
bottom:0px;
left:0px;
}
#content{
margin:0 auto;
}
</style>
</head>
<body>
<div id="wrap">
<div id="rotatescroll">
<div class="viewport">
<ul class="overview">
<li><a href="#"><img src="example/images/scoot_gray.png" /></a></li>
<li><a href="#"><img src="example/images/scoot_red.png" /></a></li>
<li><a href="#"><img src="example/images/scoot_green.png" /></a></li>
<li><a href="#"><img src="example/images/scoot_atv.png" /></a></li>
<li><a href="#"><img src="example/images/scoot_pit.png" /></a></li>
</ul>
</div>
<div class="dot"></div>
<div class="overlay"></div>
<div class="thumb"></div>
</div>
<div id="content">
<a class="back" href="#"></a>
<div class="title"></div>
<div class="navigation" id="nav">
<div class="item user">
<img src="images/bg_user.png" alt="" width="199" height="199" class="circle"/>
<a href="#" class="icon"></a>
<h2>Home</h2>
<ul class="nav">
<li><a href="#section1">About Us</a></li>
<li><a href="#services">Services</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
</div>
<div class="item home">
<img src="images/bg_home.png" alt="" width="199" height="199" class="circle"/>
<a href="#" class="icon"></a>
<h2>Bikes</h2>
<ul>
<li><a href="#scooter">Scooter</a></li>
<li><a href="#moped">Moped</a></li>
<li><a href="#atv">ATV / Pit</a></li>
</ul>
</div>
<div class="item shop">
<img src="images/bg_shop.png" alt="" width="199" height="199" class="circle"/>
<a href="#" class="icon"></a>
<h2>Shop</h2>
<ul>
<li><a href="#">Catalog</a></li>
<li><a href="#">Offers</a></li>
<li><a href="#">Order Now</a></li>
</ul>
</div>
<div class="item camera">
<img src="images/bg_camera.png" alt="" width="199" height="199" class="circle"/>
<a href="#" class="icon"></a>
<h2>Photos</h2>
<ul>
<li><a href="#">Bikes</a></li>
<li><a href="#">Helmets</a></li>
<li><a href="#">Acc.</a></li>
</ul>
</div>
<div class="item fav">
<img src="images/bg_fav.png" alt="" width="199" height="199" class="circle"/>
<a href="#" class="icon"></a>
<h2>Extra</h2>
<ul>
<li><a href="#">Dream Bike</a></li>
<li><a href="#">FAQ / Info</a></li>
<li><a href="#">Comments</a></li>
</ul>
</div>
</div>
</div>
<!-- The JavaScript -->
<script type="text/javascript" src="jquery.easing.1.3.js"></script>
<script type="text/javascript">
$(function() {
$('#nav > div').hover(
function () {
var $this = $(this);
$this.find('img').stop().animate({
'width' :'199px',
'height' :'199px',
'top' :'-25px',
'left' :'-25px',
'opacity' :'1.0'
},500,'easeOutBack',function(){
$(this).parent().find('ul').fadeIn(700);
});
$this.find('a:first,h2').addClass('active');
},
function () {
var $this = $(this);
$this.find('ul').fadeOut(500);
$this.find('img').stop().animate({
'width' :'52px',
'height' :'52px',
'top' :'0px',
'left' :'0px',
'opacity' :'0.1'
},5000,'easeOutBack');
$this.find('a:first,h2').removeClass('active');
}
);
});
</script>
<div class="section black" id="section1">
<h2>ABOUT US</h2>
<p>
HIGH STYLE MOTORING A constant commitment to quality, service, and customer satisfaction.
We are a family owned and operated dealership doing business at our present location since 1987. It is important to note that we are a fully licensed and bonded California new motorcycle dealership (Dealer # 11080) and operating a full service brick and mortar establishment dedicated to serving the needs of the most discriminating customer.
This is important as it sets us far apart from most of the "on-line" businesses that really don't have the proper knowledge or understanding of the products they sell. Here at HIGH STYLE MOTORING we are dedicated to not just the sale, but have a full service repair facility as well as one of the most extensive parts inventories available.
Over the last 23 years we have helped literally thousands of customers find the Scooter, Pit Bike, ATV or vehicle that best fit their style and budget. We will be more than happy to help you as well!
YIPPEE! Huge selection in stock and ready to take home. NATIONWIDE delivery is also available on each unit that we sell and you can rest assured knowing that your new vehicle will be delivered promptly right to your door ANYWHERE in the USA!
It's for these reasons that we sell absolutely more Scooters, Pit Bikes, ATV's and other vehicles than ANYONE in the entire area!
Check us out - we're here all day long saving you big $$$on the product that fits your style.
Retro's, Cruisers, Freeway Scoots, ATV's and the complete line-up of SSR Pit Bikes are all in stock and ready for delivery - RIGHT NOW!
We can also hand deliver your products anywhere in the Orange County or Los Angeles areas. Please give us a call at (562) 945-8361.
We also accept most major credit cards.
Stop by and say 'Hi' and let us help you to start saving money TODAY!
</p>
</div>
<!-- The JavaScript -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="jquery.easing.1.3.js"></script>
<script type="text/javascript">
$(function() {
$('ul.nav a').bind('click',function(event){
var $anchor = $(this);
/*
if you want to use one of the easing effects:
$('html, body').stop().animate({
scrollLeft: $($anchor.attr('href')).offset().left
}, 1500,'easeInOutExpo');
*/
$('html, body').stop().animate({
scrollLeft: $($anchor.attr('href')).offset().left
}, 1000);
event.preventDefault();
});
});
</script>
</body>
</html>
And whenever I take out this part of the code, the navigation starts working again, but the slider totally doesn't work... it turns into a simple/regular page anchor again! D: (The slider doesn't seem to be working either way): Code: <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> So, any ideas or info would be suuuuper appreciated b/c I've been trying to figure this out and I reallllllly want it to work! I can't seem to figure out what the problem is hurr! :\ 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>
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> Here is the program: http://www.1728.com/newwindow.htm Basically, I want to input a number in the input box, which assigns a number to the variable numval located at document.box1.b1. When clicking on the "new window" button, an alert displays the input box value, then another window opens and displays the integers 1 through 12 and the amount squared. I would like the new window to obtain the number from the previous window so that the new window will display integers (and their squares) from 1 to the value of numval. hello everybody i need your help and experience for having code to show ( overlay / modal window ) to the user when closing or navigating away from the page ( i want put in this window facebook share to make the user to share the page in his facebook ) , bytheway i wanna use it in my wordpress in every post could it be happen ? Thanks for helping Hey, I'm looking for a scrupt that looks at the current day and time and displays the relevant text such as "Breakfast Show DJ" between 6 and 10am on weekdays, "Drive Time DJ" between 5 - 8pm, "Sunday Breakfast" Sundays 6-10am, etc etc. Does anyone know of any links to download such one from, or could possibly post one? I got a bit of stick when asking for someone to post one before, so please if you're not gonna post one, help me out? I could just stick to using the php shoutcast radio stats, but I'd prefer that the on air dj name change to what the schedule shows. Don't ask why, it's just me trying out new things. So please can someone help me out? Many Thanks! |
|||||||