JavaScript - Submenu Image Change Using Script While Scrolling Down The Page

Hi there, I basically need script that will detect if the user is using Internet Explorer, and then display a different page to the one that would be loaded for any other browser.

Hey everyone,

I'm making a bit of a weird site on a server with no php, mysql etc. To save me work, I've included the header and footer using AJAX but would like to change the relevant nav bar image to the rollover image if the visitor is on that page. My javascript skills are TERRIBLE, but I came up with this anyway and was going to put it inbetween the <a> tags where the image currently sits. Probably for a very obvious reason unknown to me, the page just loads indefinitely making nothing work. Here's what I've got:

Code:

if (window.location='index.html') {
 document.write('<img src="images/key/home-r.jpg" name="home" onMouseOver="over(5)" onMouseOut="out(5)">')
  }
else {document.write('<img src="images/key/home.jpg" name="home" onMouseOver="over(5)" onMouseOut="out(5)">')}

Thanks so much for any help at all.

It must be a simple thing...

I am trying to change an image source on page load depending on the contents of a cookie:

Code:

function goVisited(cookiename,img_name,img_src) {
var visited = readCookie(cookiename);
if (visited == "1"){
//alert("visited!");
document[img_name].src=img_src;
}}

<img onload="goVisited('main1','Introduction','img/Yellow.gif');" name="Introduction" border="0" src="img/Green.gif" width="250" height="18">

I need the page to check the cookie "main1" and if its value is 1, then change the image src from Green.gif to Yellow.gif.

It almost works, but I get a stack overflow.

Hi, I have this simple code for gallery on my page. And everything working fine but when i click on small picture to change big picture if I'm page scroll up to top of page. So i scroll to the gallery change picture ad page scroll up to the top. What could be the reason? Here is live axample:
http://www.galerija-galiotovic.kus-s...test-hrvatski# Code:

  <table id="Table_galerija">

  <tr>
    <td style="width:520px;height:445px;vertical-align:top;padding:20px;">
      <h2 style="position:absolute;top:200px;color:#FFF;" id="naslov">Test hrvatski</h2>
     	  <div id="slika_velika"><img id="glavna_slika" style="max-height:390px;max-width:520px;vertical-align:middle;" src="/slike/10012012_7119092522.jpg" alt="KUS Sinj" /></div></td>
    <td>

        <div class="slikica"><a href="#" onclick="document.getElementById('glavna_slika').src='/slike/10012012_7119092522.jpg'"><img src="/slike/thumbnails/10012012_7119092522.jpg" style="max-height:88px;max-width:125px;vertical-align:middle;" alt="KUS Sinj" /></a></div>
    <div style="height:14px;"></div>
        <div class="slikica"><a href="#" onclick="document.getElementById('glavna_slika').src='/slike/12012012_7509043961.jpg'"><img src="/slike/thumbnails/12012012_7509043961.jpg" style="max-height:88px;max-width:125px;vertical-align:middle;" alt="KUS Sinj" /></a></div>
    <div style="height:14px;"></div>
        <div class="slikica"><a href="#" onclick="document.getElementById('glavna_slika').src='/slike/12012012_9295689431.jpg'"><img src="/slike/thumbnails/12012012_9295689431.jpg" style="max-height:88px;max-width:125px;vertical-align:middle;" alt="KUS Sinj" /></a></div>
    <div style="height:14px;"></div>
        <div class="slikica"><a href="#" onclick="document.getElementById('glavna_slika').src='/slike/12012012_8527430603.jpg'"><img src="/slike/thumbnails/12012012_8527430603.jpg" style="max-height:88px;max-width:125px;vertical-align:middle;" alt="KUS Sinj" /></a></div>
    <div style="height:14px;"></div>
        <div class="slikica"><a href="#" onclick="document.getElementById('glavna_slika').src='/slike/12012012_2126924535.jpg'"><img src="/slike/thumbnails/12012012_2126924535.jpg" style="max-height:88px;max-width:125px;vertical-align:middle;" alt="KUS Sinj" /></a></div>

    <div style="height:14px;"></div>
	<div id="gori"><a href="#" onmousedown="moveup()" onmouseup="clearTimeout(moveupvar)"><img src="/images/gori.png" width="119" height="23" alt="Top Sport" /></a></div>
    <div id="doli"><a href="#" onmousedown="movedown()" onmouseup="clearTimeout(movedownvar)"><img src="/images/doli.png" width="119" height="23" alt="Top Sport" /></a></div></td>
  </tr>
  </table>

Hi all!

My first post here, searched around for a good website to get some assistance and chose CodingForums.com! I'm a graphic designer, and trying my best at web design too although it's not my profession so I'm still beginner level in a sense I guess.

Anyway, my dilemma at the moment is that I have produced a site where the client would like the logo colour/image to change on refresh which I have achieved by scouring the net for codes and altering them. Now, the client wants the shapes behind the sub-headings to match the current logo colour/image on refresh as well. This would mean if the logo changed to the blue logo, I'd need all the sub-headings to be blue, and vice versa for another 3 colours.

I'm struggling to understand how I can achieve this. At the moment, I have a javascript inside the code of the index page allowing logo image change on refresh but need the sub-headings to change in sync too.

Can anyone help me out here?

Any help is greatly appreciated.

Thanks all!

WxMx

if you take a look at this site here you can see that it no longer scrolls or even displays content, but here it does. I'll bet there's a quick fix here, but not sure what it is. Any ideas?

Hi,

I am looking for a script for a scrolling DIV with the following features:

1. DIV can be scrolled vertically using mousewheel/trackpad/finger on iPad
2. Up/Down buttons which scroll slowly on hover and fast on click
3. The DIV to be scrolled will contain an audio playlist, generated by jPlayer, written in javascript. This script has a DIV for the currently playing track, and can launch functions on track change. I would like the scrolling DIV to scroll automatically to the currently playing song when the track changes.

Any help to get me going on this would be appreciated,

Thanks

Nick

My bad if this was answered somewhere else. I did search the forums but was unable to locate an answer (It is kind of a specific question)

I have an odd problem. I have the following clock script:

Code:

function Clock()
{
     var today=new Date();
     var h=today.getHours();
     var m=today.getMinutes();
     var s=today.getSeconds();
// add lead zeros to numbers less than 10
     h=checkTime(h);
     m=checkTime(m);
     s=checkTime(s);
     document.getElementById('Clock').innerHTML=h+":"+m+":"+s;
     t=setTimeout('Clock'), 500);
}

function checkTime(i)
{
     if (i<10)
       {
         i="0" + i;
       }
     return i;
}

Loaded at the page load and assigned to a div:

Code:

<body onLoad = "Clock();">

<!--the clock-->
<div align = "right" id = "Clock"></div>

With this style applied:

Code:

#Clock {font-size: 30pt;
            position: fixed;
            top: 0px;
            right: 0px;
            background: #ffffff;
            z-index: 3;
           }

The problem I've run into is this: In Chrome, whenever I scroll down, even by just one tap/click of the down arrow, the clock stops updating the time in, pardon the pun, real-time. But the second I scroll completely to the top of the page, it goes back to counting. I tested in the current (as of Nov 20th 2010) versions of FireFox, Opera and IE9 and the only browser that seems to produce this problem is Chrome. Any ideas?

http://www.***.com/5.html

i cant get a caption specific to each image to display under the arrows when the image changes. it is especially hard for me because i have to edit the javascript which confuses the **** out of me. it seemed so simple....

thanks for any help

ps i cant start an id with a digit? it doesnt seem to cause any problems...why is it stated that this cannot or shouldnot be done?

hi i have the site xtcservers.co.uk and i have downloaded a script for a horizontal image scrolling box.
i am not a very good coder and would appreciate some help.
here is the code:

Code:

//Specify the slider's width (in pixels)
var sliderwidth="300px"
//Specify the slider's height
var sliderheight="150px"
//Specify the slider's slide speed (larger is faster 1-10)
var slidespeed=1
//configure background color:
slidebgcolor="#EAEAEA"

//Specify the slider's images
var leftrightslide=new Array()
var finalslide=''
leftrightslide[0]='<a href="http://"><img src="images/uploaded/_sfpg_data/thumb/" border=1></a>'

//Specify gap between each image (use HTML):
var imagegap=" "

//Specify pixels gap between each slideshow rotation (use integer):
var slideshowgap=9

at the part were you specify the images to use is there a way to use a folder of images insdead of specifying each one for it to scroll trough.

also os there a way to center the scroll box if you have a look the box is to the left.

thanks lee

***Solved***

Its about this:
http://www.wduffy.co.uk/blog/keep-el...omment-page-1/

Everywhere is used for a whole div on some side and when its on the top of the page.
But what if its in the middle..?
Look here - http://phpbb.bg/viewtopic.php?f=14&p=1013#p1013
Scroll down and then up.Anyway to fix this?

Hi, I am new to javascript,this is my first time using it, I am wishing to have 2 buttons on my website, one that scrolls to the bottom of my page when clicked and then stops at the bottom and one that scrolls back up the page when clicked, but I want my viewers to be able to see this movement.
I have some code (below) which works fine in firefox but it doesn't work in explorer, and I can't get this code to work moving upwards (after taking away the minus from -50).

Can anybody please help me I have been battling for days trying to make it work although I am finding it hard to understand javascript being a first time user.

I currently have this javascript :
[CODE]
<head>
<script language="JavaScript">

function pageScrollup() {
window.scrollBy(0,-50); // horizontal and vertical scroll increments
if (window.pageYOffset) {
scrolldelay = setTimeout('pageScrollup()',5);
}
}
</script>
</head>


<body>
<a href="JavaScriptageScrollup()">Back to Top</a>
</body>[ICODE]

Any help is greatly appreciated.

OrangeAnt

FYI http://www.hotscripts.com/forums/jav...croll-how.html

Hi there, and happy new year.

I am looking for a javascript code with the effect used by Google in the following example;

http://www.google.co.uk/search?q=che...ient=firefox-a

... whereby the map scrolls with the page once it has been reached by the top of the browser.

If anyone could point me in the right direction I would be very grateful.

Many Thanks,
Patrick.

Hi,

I have an .aspx page which the author claims to be an RSS feed (http://gcn.com/rss-feeds/state-local.aspx). It is simply a list of links with a description for each. I am trying to embed these links into an RSS feed on my own page. I am using code from http://www.mioplanet.com/rsc/newsticker_javascript.htm to create the scrolling ticker. Do I need to do something to convert the .aspx page to an RSS feed? Please help. Thanks.