I have a site up and running called www.kalahari.co.za which points to www.kalahari-adventures.co.za As the business depends on adventurous people seeing images of the place, the bigger the better. So I have designed the site to show one static background pic to each page. I sorted out a problem of different browsers by have a hidden index page that looks at the monitor a viewer has and decides that if you have a 1024 x 768 monitor it then opens a page index1024.htm that has the appropriately sized background pic.
Now I said to my client he would get better search engine ratings if we created 3 sites and the existing site is spread over those sites. Anyway I have done all that only to discover from High Rankings Advisor (highrankings.com that search engines have now cottoned onto this (competitors complaining I suppose). But I'm going ahead anyway.
My problem is that I have put all my keywords and descriptions on the 1024 pages. But if a person sees that page in a search engine clickt to view it and has a 800 x 600 monitor then my script is not going to work.
I have tried putting my index page script onto all the pages (see script below), but when I open a unique page it looks for the index page in the folder where that doc is situated. I suppose a quick and dirty would be to direct the viewer back to the index page which will then activates the scrpt (see below) that checks for the right monitor size.
I would prefer the viewer to stay on page. So If someone who knows Javascript can rewrite the script so that A) it looks at the name of the page. And B) once it sees that page's name it has to then look for that same page in the appropriate folder and open that page. (folders are docs800, docs1024 and docs1624)
The problem is that I can't have the same index page script because at the moment if the script is on the page I am trying to open, it loops forever.
How do I sort this out?
This is the present script on the index page.
<script language="JavaScript">
<!--// hide bad old browsers
var s800x600page = "index800.htm";
var s1024x768page = "index1024.htm";
var s1152x864page = "index1264.htm";
var s1280x720page = "index1264.htm";
var s1280x960page = "index1264.htm";
var s1280x1024page = "index1264.htm";
var pagetype;
if ((screen.height == 600) && (screen.width == 800)) { pagetype = 2; }
else if ((screen.height == 768) && (screen.width == 1024)) { pagetype = 3; }
else if ((screen.height == 864) && (screen.width == 1152)) { pagetype = 4; }
else if ((screen.height == 720) && (screen.width == 1280)) { pagetype = 4; }
else if ((screen.height == 960) && (screen.width == 1280)) { pagetype = 4; }
else if ((screen.height == 1024) && (screen.width == 1280)) { pagetype = 4; }
else { pagetype = 2; }
if (pagetype == 2) { window.location.href = s800x600page }
else if (pagetype == 3) { window.location.href = s1024x768page }
else if (pagetype == 4) { window.location.href = s1152x864page }
else if (pagetype == 4) { window.location.href = s1280x720page }
else if (pagetype == 4) { window.location.href = s1280x960page }
else if (pagetype == 4) { window.location.href = s1280x1024page }
//-->
</script>
I design but programming is still in my dreams ...
I am using a very simple search-type page to enable users to input a model number and its page appears in a inline frame. Its not a true search as it is simply relying on a person entering the correct html page name to find it. But this works perfectly in my application.The problem I have is that I cannot get the type box to accept enter key as a submitt, only a click of the mouse will submitt the request. If enter is pressed the box loses the users input but no action is taken.I think this may be a javascript issue. I have posted the code below.
What I require seems straightforward, for each image in my gallery I would like to have a unique URL, so if there are 5 images then 5 different URL's thus enabling me to toggle content relating to the particular image, the code I believe I need to change is as follows;
I'm building a jQuery cycle slideshow into a Wordpress post. The slideshow will cycle through images attached to the post, and the final slide will always be a text box (generated by a meta box).
I'm trying to build a Pager that would display numbers (as per default), but for the last slide, the pager button would simply be "Text".
e.g.
1 2 3 4 5 Text
I have explored PagerAnchorBuilder but am still struggling.
I have this demo site here [URL] It's a simple div with overflow: hidden this containing div houses 3 divs each containing different content. The nav at the top scrolls the divs to show the div relating to the nav clicked. The problem I have is with the last btn - Planes. The div containing the planes photos doesn't scroll to the top of the containing div but sits at the bottom. The first two btns. work as expected so I don't understand why the last btn doesn't.
My project is stated in the title, I want to let users who want to see my portfolio click on a button and the portfolio page slide over my index page. Ex. at www.visumdesignz.com over to the left is a button that says portfolio. when you click on it an extruder pops out, I used the extruder for another function, I decided I didn't want that function, but it gave me this idea. I want the extruder to slide over all of the content.
I noticed the facebook app has a similar function to what I am looking for, take a look at it, when you are looking at your dashboard the news feed slides off to the side, that's a similar idea, even though this isn't mobile, you get the idea, at least I hope.
I am working a project where I am using two monitors and using HTML/Javascript to display the information I want.
I have my main stuff on the main monitor, but when each page loads, I want an image to load fullscreen on the second monitor as well. I am using 800x600 resoution on both.
If I use:
function openWindow() { mainWindow = window.open("thispage.htm","pagename","fullscreen=yes"); }
that works fine for the main monitor.
I have then tried to use the second monitor to open an image by using the same type of thing:
function imageWindow() { openImage = window.open("image.jpg","imagepage","fullscreen=yes"); openImage.moveTo(801,0); parent.focus(); }
I am trying to use it with the onload command as well:
<body onLoad="imageWindow();">
I am passing arguments to these functions but simplified it here.
Anyhow it will only open it full screen on the first monitor. I can position it and move it to the second monitor if it is not full screen just fine.
I am developing a website in which I will support two screen resolutions ( 800X600 & 1024X768 ) by using two different stylesheets for better browsing experience. I need a code to detect resolution and then putting the desired stylesheet in page code at request time. If there is any server side language to be used with it then I can use PHP.
I am trying to build on my weather website. On the page I am working on I have many images. These images are best viewed at large sizes, but if all of them were large, the page would look terrible, so I have them set to take the large image, shrink on load, enlarge on mouseover, then shrink on mouseout.. the problem is, if users do not scroll down my page, and try to look at the second row of images.. Then the bottom half of the image is cut off.. So what I need to do is Figure Out how to get my images to either appear and center of page on enlarge, or to have the page scroll down on enlarge..
I am running client (browser) side Javascript, and would like to somehow be able to detect whether some Javascript code causes any changes to occur to the DOM model.
Is there any way to do this? For example, with some kind of try/catch block?
Is there a way to monitor a newly opepend child window with opener, even when the page keeps reloading ?
Say window A opens window B and gives it a name/handle "myWindow". At this point anywhere in window A, we could say myWindow.location.href to find out where the child is.
But what if someone was to take window A to another site, and than return using history button, OR reload it completely.
upon load the var myWindow would get executed again, and it seems like the handle would be lost. I tried to see if there was a window.children collection that might still hold window B in its subset, but was not able to find a way thus far.
I am interested in using RaphaelJS for creating VML/SVG rounded corners etc, but unless i physically put the <script> right after the element to which it needs to be applied, i have to rely on the single DOM load() event. which causes a delay before any script is executed,...thus a FOUC (flash of unstyled content).
i'm guessing there is no way to track when individual elements are loaded into the DOM via a CSS filter or similar, or another way around this other than having <script> in the body or just dealing the the load delay?
I want to make a custom visitor tracking tool and like Google Analytics it must be able to track how long time visitors spend on each page.How do you recommend doing this?I thought of using the Javascript onload event to start counting time serverside and then the onbeforeunload event to do tell the server to end the time count. I'm just skeptic of an infinite visit duration if the visitor's browser for some reason doesn't call the event (ie power outage).
I am trying to use it to direct users to a search page based on the values of two drop down boxes. The issue i am having is that the code below works fine on a test page, but not on my test domain (with wordpress theme) and so i was wondering whether there is anything I am doing wrong... Is onclick already defined maybe? I'm not sure how it works to be honest... :(
<script type="text/javascript"> function gosearch() { var breed = document.getElementById('breed').value; var area = document.getElementById('area').value; var site = "http://hairloss-help.net/?s="; var searchurl = site + breed + area; [Code]...
.change() is only for form elements minus check boxes/radio buttons, etc.Are any of you aware of a script that does this already? Hopefully one that is easy to implement.I just want to monitor things like height, number of inner elements, or any change in the inner HTML.
I have a page that submits to a db then re-loads its self with new information. Unfortunately it goes wrong when the user double clicks on a one of many text links that provides the info for the display on reload. How do I stop users from double clicking on the page? Ideally I think I would like to call some sort of js function from body onload as I presume this would then cover the whole of the page, but have no idea if this is possible or how to go about writing it.
I am new to javascript and I was wondering what is the best way to solve my problem below:
I have 2 navigation menus one using flash and one using images. I wanted to use javascript to detect if the viewer is using a mac and then remove the div that contains the flash and if they are not using a mac then remove the div that contains the images.
If there is a better way to resolve this problem I am all ears.
Is there a way to show something to visitors *only* if they have css turned off?
How many people do turn style sheets off, or have browsers that don't support it?
I have a great layout design idea, but without css on, it'll look awful. Most of the stuff I can get around, but not one item that'll make one area of the page almost unreadable . Unfortunatly, that one area is the site navigation ...
Is it possible with javascript to retrieve somebody's Computer name when he connects to a webserver? (So the webserver receives the computername of the client).
