JavaScript - Problem With Links In Javascript.

I've created a slideshow on our site using the java template at
http://www.javascriptkit.com/script/.../jsslide.shtml

Are there simple modifications I can make to this code in order to cause clicking on the image links to go straight to them, rather than creating a new window/tab?

Thanks for the help.

Hi Everyone,

I have a strange problem that I can't resolve.

Have a look at www.snaptease.co.uk/random.html and you will see a random image every time you refresh.

Now look at www.snaptease.co.uk/random1.html and you won't see the image. The only difference is in the js/random.js and js/random1.js each file references.

js/random.js uses the same html link to index.html
js/random1.js links to individual html files that exist and valid.

The working code looks like this:
[CODE] images[0] = "<a href = 'index.html'><img src='images/games/aa01q.jpg' alt='album art' title='Do you recognise this album?'></a>";[CODE]

The non working code looks like this:
[CODE] images[0] = "<a href = 'answers/aa01.html'><img src='images/games/aa01q.jpg' alt='album art' title='Do you recognise this Album?'></a>";[CODE]

Even if I enter the full url it makes no difference.

Please tell me what I am doing wrong and how to fix it.

I've been banging my head over this for a while now so I would appreciate any help.

Thanks in advance

Martin

Below is a javascript function from my website that loops through nodes in an XML file retrieving certain information about those who joined in the current month/year. The part in red creates a link which when clicked runs a function called show() with the relevant i variable value e.g. show(2) for the second node if that is relevant. Anyway the red part works in Chrome but not Internet Explorer (surprise surprise). I did some research which says that .setattribute is not allowed in IE. How can I change the red code to create links for the relevant records which works in IE?

Thank you for your help

Code:

function displaymember() {
    var d = new Date();

    var curr_month = d.getMonth();
    curr_month++;
    if (curr_month < 10) curr_month = "0" + curr_month;
    var curr_year = d.getFullYear();

    for (i = 0; i < x.length; i++) {

        membershipstatus = (x[i].getElementsByTagName("membership_status")[0].childNodes[0].nodeValue);
        name = (x[i].getElementsByTagName("name")[0].childNodes[0].nodeValue);
        body = (x[i].getElementsByTagName("body_type")[0].childNodes[0].nodeValue);
        ethnicity = (x[i].getElementsByTagName("ethnicity")[0].childNodes[0].nodeValue);
        sex = (x[i].getElementsByTagName("sex")[0].childNodes[0].nodeValue);
        seeking = (x[i].getElementsByTagName("seeking")[0].childNodes[0].nodeValue);
        date = (x[i].getElementsByTagName("date_joined")[0]);
        month = (date.getElementsByTagName("month")[0].childNodes[0].nodeValue);
        year = (date.getElementsByTagName("year")[0].childNodes[0].nodeValue);
         newa = document.createElement("a");
        aIdName = "my" + i + "a";
        ahref = "#";
        aclick = "show(" + i + ")";
        newa.setAttribute("id", aIdName);
        newa.setAttribute("href", ahref);
        newa.setAttribute("onclick", aclick);
        newa.innerHTML = name + " | " + body + " " + ethnicity + " " + sex + " with " + membershipstatus + " membership seeks " + seeking + "<br/>"; 

        if (curr_month == month && curr_year == year) {
            document.getElementById("member").appendChild(newa);
        }


    }

}

Okay. So here's what I'm trying to do. I have my landing page to my site and near the bottom I have 4 little 48x48 class divs (for social network link images if you were wondering ). Each Class div has a background style all to it's own. (so in this case 4 different divs with 4 different class names) .

What I want to do with the javascript is to have a function(s) that when called on (depending on which div.class was/is clicked on) will open up a lightbox/new page containing the new page (pertaining to the appropriate social network, depending on which class has been clicked on).

I don't want to put an <a></a> tag around the div.classes themselves seperately because the landing page itself has 8 different styles, plus the div.classes I would have to hunt down within the site itself. haha

Basically in short I want the classes to have seperate links that when clicked upon it calls the function, opens the lightbox (or opens the new tab/page) and loads the appropriate page.

Think yall can help me out here?

Hey

Im trying to add links in the images for EasySlide but I cant see to see where to put it.....

Here is the .js code:

Code:

/**
 * @author Bruno Bornsztein <bruno@missingmethod.com>
 * @copyright 2007 Curbly LLC
 * @package Glider
 * @license MIT
 * @url http://www.missingmethod.com/projects/glider/
 * @version 0.0.3
 * @dependencies prototype.js 1.5.1+, effects.js
 */
/*  Thanks to Andrew Dupont for refactoring help and code cleanup - http://andrewdupont.net/  */

Glider = Class.create();
Object.extend(Object.extend(Glider.prototype, Abstract.prototype), {
    initialize: function(wrapper, options){
        this.handStopped = false;
        this.animating = false;
        this.wrapper = $(wrapper);
        this.scroller = this.wrapper.down('div.scroller');
        this.contentDiv = this.scroller.down('div');
        this.current = $(this.contentDiv.children[0].id);
        this.sectionWidth = this.contentDiv.children[0].getWidth();
        this.slideRelations = {};

        this.options = Object.extend({
            effectType: 'mosaic',
            duration: 3.0,
            frequency: 3,
            eRows: Prototype.Browser.IE ? 3 : 6,
            eCols: Prototype.Browser.IE ? 6 : 12,
            eColor: '#FFFFFF'
        }, options || {});

        this.effects = {
            'scroll'        : this.scroll,
            'speedscroll'   : this.speedscroll,
            'fade'          : this.fade,
            'blend'         : this.blend,
            'mosaic'        : this.mosaic
        };

        this.sections = this.wrapper.getElementsBySelector('div.section');
        for (var i = 0; i < this.sections.length; i++) {
            var nextSibling = this.sections[i].nextSiblings()[0];
            if (nextSibling){
                this.slideRelations[this.sections[i].id] = nextSibling.id;
            } else {
                this.slideRelations[this.sections[i].id] = this.sections[0].id;
            }
            this.effects[this.options.effectType].bind(this)().prepare(this.sections[i], i);
        }

        this.events = {
            mouseover: this.pause.bind(this),
            mouseout: this.resume.bind(this)
        };

        this.addObservers();
		

        if (this.options.autoGlide) {
            this.start();
        } else {
            this.handStopped = true;
        }
    },
	
	

    scroll: function() {
        var glider = this;
        return {
            prepa  function(el, i) {
                if (i > 0) {
                    $(el).setStyle('left: ' + glider.sectionWidth + 'px;');
                } else {
                    glider.toggleControl($$('a[href="#' + el.id + '"]')[0]);
					
                }
            },
            animate: function(elementIdToShow, direction) {
                $(elementIdToShow).setStyle('left: ' + (direction === 'normal' ? glider.sectionWidth : -glider.sectionWidth) + 'px;');

                new Effect.Parallel([
                    new Effect.Move(elementIdToShow, {
                        sync: true,
                        x: 0,
                        y: 0,
                        mode: 'absolute'
                    }),
                    new Effect.Move(glider.current.id, {
                        sync: true,
                        x: direction === 'normal' ? -glider.sectionWidth : glider.sectionWidth,
                        y: 0,
                        mode: 'absolute'
                    })
                ], {
                    duration: glider.options.duration,
                    afterFinish: function() {
                        glider.setAnimating(false);
                    }.bind(glider)
                });

            }
        }
    },
	
	

    speedscroll: function() {
        var glider = this;
        return {
            prepa  function(el, i) {
                if (i > 0) {
                    $(el).setStyle('left: ' + glider.sectionWidth + 'px;');
                } else {
                    glider.toggleControl($$('a[href="#' + el.id + '"]')[0]);

                }
            },
            animate: function(elementIdToShow, direction) {
                $(elementIdToShow).setStyle('left: ' + (direction === 'normal' ? glider.sectionWidth : -glider.sectionWidth) + 'px;');
                $(elementIdToShow).setStyle({zIndex: 5});
                $(glider.current.id).setStyle({zIndex: 1});
                var currentId = glider.current.id;

                new Effect.Move(elementIdToShow, {
                    x: 0,
                    y: 0,
                    mode: 'absolute',
                    transition: Effect.Transitions.linear,
                    duration: glider.options.duration / 2,
                    afterFinish: function() {
                        moveCurrent.cancel();
                        $(currentId).setStyle('left: ' + (direction === 'normal' ? -glider.sectionWidth : glider.sectionWidth) + 'px;');
                        glider.setAnimating(false);
                    }
                });

                var moveCurrent = new Effect.Move(glider.current.id, {
                    x: direction === 'normal' ? -glider.sectionWidth : glider.sectionWidth,
                    y: 0,
                    mode: 'absolute',
                    transition: Effect.Transitions.linear,
                    duration: glider.options.duration
                });
            }
        }
    },

    fade: function() {
        var glider = this;
        return {
            prepa  function(el, i) {
                if (i > 0) {
                    el.setOpacity(0);
                    $(el).setStyle({ zIndex : '0' });
                } else {
                    glider.toggleControl($$('a[href="#' + el.id + '"]')[0]);
                    $(el).setStyle({ zIndex : '998' });
                    $$('.easyslidecontrolwr')[0].setStyle({ zIndex : '999' });
                }
            },
            animate: function(elementIdToShow, direction) {
                $(elementIdToShow).setStyle({ zIndex : '998' });
                $(glider.current.id).setStyle({ zIndex : '0' });

                new Effect.Opacity(glider.current.id, {
                duration: glider.options.duration,
                from: 1.0,
                to: 0.0,
                afterFinish: function() {
                    new Effect.Opacity(elementIdToShow, {
                        duration: glider.options.duration,
                        from: 0.0,
                        to: 1.0,
                        afterFinish: function() {
                            glider.setAnimating(false);
                        }.bind(glider)
                    });

                }.bind(glider)
            });
            }
        }
    },

    blend: function() {
        var glider = this;
        return {
            prepa  function(el, i) {
                if (i > 0) {
                    el.setOpacity(0);
                    $(el).setStyle({ zIndex : '0' });
                } else {
                    glider.toggleControl($$('a[href="#' + el.id + '"]')[0]);
                    $(el).setStyle({ zIndex : '998' });
                    $$('.easyslidecontrolwr')[0].setStyle({ zIndex : '999' });
                }
            },
            animate: function(elementIdToShow, direction) {
                $(elementIdToShow).setStyle({ zIndex : '998' });
                $(glider.current.id).setStyle({ zIndex : '0' });
                new Effect.Parallel([
                    new Effect.Opacity(glider.current.id, {
                        sync: true,
                        duration: glider.options.duration,
                        from: 1.0,
                        to: 0.0
                    }),
                    new Effect.Opacity(elementIdToShow, {
                        sync: true,
                        duration: glider.options.duration,
                        from: 0.0,
                        to: 1.0
                    })
                ], {
                    duration: glider.options.duration,
                    afterFinish: function() {
                        glider.setAnimating(false);
                    }.bind(glider)
                });
            }
        }
    },

    mosaic: function() {
        var glider = this;
        var delayedAppear = function(eSquare) {
            var opacity = Math.random();
            new Effect.Parallel([
                new Effect.Appear ( eSquare, {from: 0, to: opacity, duration: this.options.duration} ),
                new Effect.Appear ( eSquare, {from: opacity, to: 0, duration: this.options.duration/1.25} )
            ], {sync: false});
        };
        return {
            prepa  function(el, i) {
                if (i > 0) {
                    el.setStyle({ zIndex : 0 });
                    el.hide();
                } else {
                    el.setStyle({ zIndex : 999 });
                    glider.toggleControl($$('a[href="#' + el.id + '"]')[0]);
					
					
                }
                if (i == (glider.sections.length - 1)) {
                    glider.eSquares 	= [];
                    var elDimension	 	= el.getDimensions();
                    var elWidth  		= elDimension.width;
                    var elHeight 		= elDimension.height;

                    var sqWidth 		= elWidth / glider.options.eCols;
                    var sqHeight 		= elHeight / glider.options.eRows;

                    $R(0, glider.options.eCols-1).each(function(col) {
                        glider.eSquares[col] = [];
                        $R(0, glider.options.eRows-1).each(function(row) {
                            var sqLeft = col * sqWidth;
                            var sqTop  = row * sqHeight;
                            glider.eSquares[col][row] = new Element('div').setStyle({
                                opacity         : 0,
                                backgroundColor : glider.options.eColor,
                                position        : 'absolute',
                                zIndex          : 5,
                                left            : sqLeft + 'px',
                                top             : sqTop + 'px',
                                width           : sqWidth + 'px',
                                height          : sqHeight + 'px'
                            });

                            el.up('div').insert(glider.eSquares[col][row]);
                        }.bind(glider))
                    }.bind(glider));
                }
            },

            animate: function(elementIdToShow, direction) {
                $(elementIdToShow).setStyle({ zIndex : 999 });
                $(glider.current.id).setStyle({ zIndex : 0 });
                new Effect.Parallel([
                    new Effect.Fade(glider.current.id, {sync: true}),
                    new Effect.Appear(elementIdToShow, {sync: true})
                ], {
                    duration: glider.options.duration,
                    afterFinish: function() {
                        glider.setAnimating(false);
                    }.bind(glider)
                });
                $R(0, glider.options.eCols-1).each(function(col) {
                    $R(0, glider.options.eRows-1).each(function(row) {
                        var eSquare = glider.eSquares[col][row];
                        var delay = Math.random() * (glider.options.duration / 3) * 1000;
                        setTimeout(delayedAppear.bind(glider, eSquare), delay);
                    }.bind(this))
                }.bind(this));
            }
        }
    },

    setAnimating: function(flag) {
        this.animating = flag;
        if (flag) {
            $$('.easyslidecontrolwr')[0].addClassName('disabled');
        } else {
            $$('.easyslidecontrolwr')[0].removeClassName('disabled');
        }
    },

    addObservers: function(){
        this.wrapper.observe('mouseover', this.events.mouseover);
        this.wrapper.observe('mouseout', this.events.mouseout);

        var descriptions = this.wrapper.getElementsBySelector('div.sliderdescription');
        descriptions.invoke('observe', 'mouseover', this.makeActive);
        descriptions.invoke('observe', 'mouseout', this.makeInactive);

        //Nubmbers
        var controls = this.wrapper.getElementsBySelector('div.easyslidercontrol a.easyslidedirect');
        controls.invoke('observe', 'click', this.numClick.bind(this));

        //Arrows
        var stop = this.wrapper.getElementsBySelector('div.easyslidercontrol a.easyslidestop');
        stop.invoke('observe', 'click', this.stop.bind(this));

        var play = this.wrapper.getElementsBySelector('div.easyslidercontrol a.easyslideplay');
        play.invoke('observe', 'click', this.start.bind(this));

        var prev = this.wrapper.getElementsBySelector('div.easyslidercontrol a.easyslideprev');
        prev.invoke('observe', 'click', this.previous.bind(this));

        var next = this.wrapper.getElementsBySelector('div.easyslidercontrol a.easyslidenext');
        next.invoke('observe', 'click', this.next.bind(this));
    },

    numClick: function(event){
        var element = Event.findElement(event, 'a'); /*clicked link*/
        var nextElementId = element.href.split('#')[1];
        var direction = 'normal';
        for (var i in this.slideRelations) {
            if (i === this.current.id) {
                direction = 'normal';
                break;
            }
            if (i === nextElementId) {
                direction = 'reverse';
                break;
            }
        }
        this.animate(nextElementId, direction);
        Event.stop(event);
    },

    animate: function(elementIdToShow, direction){
        if (this.animating || this.current.id == elementIdToShow) {
            return;
        }
        this.setAnimating(true);
        this.toggleControl($$('a[href="#' + elementIdToShow + '"]')[0]);
		
	
        this.effects[this.options.effectType].bind(this)().animate(elementIdToShow, direction);

        this.current = $(elementIdToShow);
    },

    next: function(event){
        var nextMove = '';
        nextMove = this.slideRelations[this.current.id];
        this.animate(nextMove, 'normal');
        if (event) {
            Event.stop(event);
        }
    },

    previous: function(event){
        var prevMove = '';
        for (var i in this.slideRelations) {
            if (this.slideRelations[i] == this.current.id) {
                prevMove = i;
                break;
            }
        }
        this.animate(prevMove, 'reverse');
        if (event) {
            Event.stop(event);
        }
    },

    makeActive: function(event){
        var element = Event.findElement(event, 'div');
        element.addClassName('active');
    },

    makeInactive: function(event){
        var element = Event.findElement(event, 'div');
        element.removeClassName('active');
    },

    toggleControl: function(el){
        if (!el) return false;
        $$('.easyslidercontrol a').invoke('removeClassName', 'active');
        el.addClassName('active');
    },

    stop: function(event){
        this.handStopped = true;
        clearTimeout(this.timer);
        Event.stop(event);
    },

    start: function(event){
        this.handStopped = false;
        this.periodicallyUpdate();
        if (event) {
            Event.stop(event);
        }
    },

    pause: function(event){
        if (!this.handStopped) {
            clearTimeout(this.timer);
            this.timer = null;
        }
        Event.stop(event);
    },

    resume: function(event){
        if (!this.handStopped) {
            this.periodicallyUpdate();
        }
    },

    periodicallyUpdate: function(){
        if (this.timer != null) {
            clearTimeout(this.timer);
            this.next();
        }
        this.timer = setTimeout(this.periodicallyUpdate.bind(this), this.options.frequency * 1000);
    }
});

Somewhere there each time a image appears I want it to go to a certain link (for example purposes: google.com). How can I do this?

I imagine there is a onClick event somewhere in there but I just cannot find it.

Thanks!

Hello,

I can tracking outgoing links now for html links. How can I track outgoing links in flash with jquery or something else?

Best Regards
Code:

<html>
 <head>
  <meta charset="utf-8">
  <title>Tracking outgoing links with JavaScript and PHP</title>
 </head>
 <body>
  <p><a href="http://www.google.com/">Test link to Google</a></p>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
  <script>
   $(function() {
    $('a').click(function() {
     $.post('http://www.example.com/trackol.php', { result: 'click' }, 'html');
    });
   });
  </script>
 </body>
</html>

from: http://stackoverflow.com/questions/2077823/tracking-outgoing-links-with-javascript-and-php

Instead of using window.open, which I understand opens a new window, is there a code that will make the link open in the parent window?

Hi guys,

I need some help. Im trying to make a navagation menu with images that need to be changed when someone hovers over the child category.

So lets say I have a menu that looks like this:

Code:

<img src="notactiveimagemenu1.jpg" alt="">
<ul id="menu1">
   <li>link</li>
   <li>link</li>
   <li>link</li>
</ul>
<img src="notactiveimagemenu2.jpg" alt="">
<ul id="menu2">
   <li>link</li>
   <li>link</li>
   <li>link</li>
</ul>

Now what im trying to do is if someone hovers over the li items from menu1 to change the image src of menu1.jpg to active.

I was hoping to do this with some javascript.
Code:

// i was thinking about something like this:

// first put menu items in a array

// then use document.getElementById(id).onmouseover = function()
// and make some sort of check to see which src should be changed.

Now I really have no clue how to do it.
So if anyone knows a cool solution please let me know.
I know I could add onmouseover events to each li item and changing the src of the category. But Im trying to find a better solution.
And I think I should be able to use document.getElementById(id).onmouseover = function() for that.

Anyway thanks for any tips.
Please note I know I could use jquery to do all of this very easy but I consider this practice because I don't know that much javascript.

I hate javascript....

OK, here's my latest challenge with Javascript. I recently went into twp php files and made a few very minor changes to some outdated $date functions. Now, I have three small icons for 'copy', 'paste','delete' using the javascript 'onclick' function that have stopped working.

In fact, when I replace the two recently revised files with the originals, these icons no longer work there either.

Any help would be appreciated. I'm simply at a total loss for ideas here.

From the primary php file is the relevant lines of source code....As far as I can tell, the second paragraph in each area is returning a 'null' value; i.e. o1a.options.selectedIndex is null.

Code:

function aCopy(dt){
o1a = document.getElementById("avail_1a_" + dt);
o1b = document.getElementById("avail_1b_" + dt);
o2a = document.getElementById("avail_2a_" + dt);
o2b = document.getElementById("avail_2b_" + dt);
o3a = document.getElementById("avail_3a_" + dt);
o3b = document.getElementById("avail_3b_" + dt);

avail_1a = o1a.options.selectedIndex;
avail_1b = o1b.options.selectedIndex;
avail_2a = o2a.options.selectedIndex;
avail_2b = o2b.options.selectedIndex;
avail_3a = o3a.options.selectedIndex;
avail_3b = o3b.options.selectedIndex;
}

function aPaste(dt){
o1a = document.getElementById("avail_1a_" + dt);
o1b = document.getElementById("avail_1b_" + dt);
o2a = document.getElementById("avail_2a_" + dt);
o2b = document.getElementById("avail_2b_" + dt);
o3a = document.getElementById("avail_3a_" + dt);
o3b = document.getElementById("avail_3b_" + dt);

o1a.options.selectedIndex = avail_1a;
o1b.options.selectedIndex = avail_1b;
o2a.options.selectedIndex = avail_2a;
o2b.options.selectedIndex = avail_2b;
o3a.options.selectedIndex = avail_3a;
o3b.options.selectedIndex = avail_3b;
}

function aDelete(dt){
o1a = document.getElementById("avail_1a_" + dt);
o1b = document.getElementById("avail_1b_" + dt);
o2a = document.getElementById("avail_2a_" + dt);
o2b = document.getElementById("avail_2b_" + dt);
o3a = document.getElementById("avail_3a_" + dt);
o3b = document.getElementById("avail_3b_" + dt);

o1a.options.selectedIndex = 0;
o1b.options.selectedIndex = 0;
o2a.options.selectedIndex = 0;
o2b.options.selectedIndex = 0;
o3a.options.selectedIndex = 0;
o3b.options.selectedIndex = 0;

From the supporting php file are the following lines of code....
Code:

$s .= "<td nowrap=nowrap class=calendar style='border-left:1px dashed #000;'>";
$s .= "<a href='javascript:void(0);' onclick=\"aCopy('$year-$month-$d');\"><img src='../admin/_calendar/Copy.gif' alt='Copy Availability' width='16' height='16' border='0' /></a>";
$s .= " <a href='javascript:void(0);' onclick=\"aPaste('$year-$month-$d');\"><img src='../admin/_calendar/Paste.gif' alt='Paste Availability' width='16' height='16' border='0' /></a>";
$s .= " <a href='javascript:void(0);' onclick=\"aDelete('$year-$month-$d');\"><img src='../admin/_calendar/Delete.gif' alt='Delete/No Availability' width='16' height='16' border='0' /></a>";
$s .= "</td>";

None of these lines of code were changed or altered when I was updating the code.

Any thoughts or suggestions would be deeply appreciated?

Talltom

Hi,

I have a page with an iframe in it.

I need my script to search the contents of the iframe for a specified string, and click the link within it. Here is my coding.

Code:

<script>
setTimeout(function() { window.location.reload(); }, 2000); // 2 seconds, e.g.

$(document).ready(function() {
$('a[href*="13468100"]', $("game").contents()).closest('tr').find('.fightActionInnerInner').parent("a").trigger("click");
});
</script>

</head>

<body>

<iframe src="http://vl.storm8.com/hitlist.php" width="100%" height="800px" id="game"></iframe>

In the post below is the content of the iframe.

At the moment the script doesn't want to click the link, it just refreshes the page. Can anyone advise?

Hello all!

I'm having a bit of an issue here with my lastest project. What I'm trying to do is have a menu that a user would click one of two links which would change the targeted iFrame, then repeat for two more options, and again for two more.

It is essentially a filtering system for videos (the best way for you to see what I mean is to check out http://grph.cmwdesign.ca).

My actual issue here is the changing of the iframe href, and on top of that, I seem to not to be able to properly get my functions to run all the time.

Here is my Javascript:

Code:

		

		var categoryLink=new Array(); 
		var counter;
		var link = "";
		categoryLink[0] = "";   
		categoryLink[1] = "";   
		categoryLink[2] = "";   
		counter = "0";

$(document).ready(function() {
        $(".atonal").live('click', function() { {
          alert("sometext");
          		if (categoryLink[0]=="") {
					categoryLink[0] = "atonal";
					$("a.frame").attr('href', categoryLink[0] + categoryLink[1] + categoryLink[2]);
					
				
				else {
					categoryLink[0] = "";
					$("a.frame").attr('href', categoryLink[0] + categoryLink[1] + categoryLink[2]);
				}
          
        });
});

$(document).ready(function() {
        $(".tonal").live('click', function() {
          alert("sometext");
          		if (categoryLink[0]=="") {
					categoryLink[0] = "tonal";
					$("a.frame").attr('href', categoryLink[0] + categoryLink[1] + categoryLink[2]);
					
				
				else {
					categoryLink[0] = "";
					$("a.frame").attr('href', categoryLink[0] + categoryLink[1] + categoryLink[2]);
				}
          
        });
});


$(document).ready(function() {
        $(".being").live('click', function() {
          alert("sometext");
         categoryLink[1] = "being"; $("a.frame").attr('href', categoryLink[0] + categoryLink[1] + categoryLink[2]);
					
          
          		if (categoryLink[1]=="") {
					categoryLink[1] = "being";
					$("a.frame").attr('href', categoryLink[0] + categoryLink[1] + categoryLink[2]);
					
				
				else {
					categoryLink[1] = "";
					$("a.frame").attr('href', categoryLink[0] + categoryLink[1] + categoryLink[2]);
				}
          
        });
});

$(document).ready(function() {
        $(".doing").live('click', function() {
          alert("sometext");
          		if (categoryLink[1]=="") {
					categoryLink[1] = "doing";
					$("a.frame").attr('href', categoryLink[0] + categoryLink[1] + categoryLink[2]);
					
				
				else {
					categoryLink[1] = "";
					$("a.frame").attr('href', categoryLink[0] + categoryLink[1] + categoryLink[2]);
				}
          
        });
});


$(document).ready(function() {
        $(".abstract").live('click', function() {
                 alert("sometext");
          		if (categoryLink[2]=="") {
					categoryLink[2] = "abstract";
					$("a.frame").attr('href', categoryLink[0] + categoryLink[1] + categoryLink[2]);
					
				
				else {
					categoryLink[2] = "";
					$("a.frame").attr('href', categoryLink[0] + categoryLink[1] + categoryLink[2]);
				}
          
        });
});

$(document).ready(function() {
        $(".documentary").live('click', function() {
                 alert("sometext");
          		if (categoryLink[2]=="") {
					categoryLink[2] = "documentary";
					$("a.frame").attr('href', categoryLink[0] + categoryLink[1] + categoryLink[2]);
					
				
				else {
					categoryLink[2] = "";
					$("a.frame").attr('href', categoryLink[0] + categoryLink[1] + categoryLink[2]);
				}
          
        });
});

and the HTML in question:

Code:

<table>
<tr>
<td height="35" width="210" valign="top">choose your sound</td>
<td width="165" valign="top"><a href="#" id="atonal">atonal sounds</a></td>
<td width="165" valign="top"><a href="#" id="tonal">tonal sounds</a></td>
</tr>
<tr>
<td height="35" width="210" valign="top">choose your text</td>
<td width="165" valign="top"><a href="#" id="being">being words</a></td>
<td width="165" valign="top"><a href="#" id="doing">doing words</td>
</tr>
<tr>
<td height="35" width="210" valign="top">choose your image</td>
<td width="165" valign="top"><a href="#" id="abstract">abstract images</a></td>
<td width="165" valign="top"><a href="#" id="documentary">documentary images</a></td>
</tr>
</table>

I'm no Javascript wiz, so I'm sure I'm probably not going about this entirely the correct way. Any suggestions would be great!

I need someone to link this:



thiswebsite.com/12.html
then someone clicks on a link, and the url would go to
thiswebsite.com/12_1.html

The link script has to subtract the ".html" from the original url, then add "_1.html" to the new url.

I am pretty sure this is a simple script to make, I just do not have the time to google this and figure this out. I will pay $5 to anyone who fix this problem for me.
you can post the solution here, with your paypal email so I can pay you,
or email me the solution at hotgoat145@yahoo.com and tell me your paypal email so I can pay you.



Im looking for a javascript code, because .htaccess does not work for me.
it has to be in javascript,
where it is like this
<script language='JavaScript' type='text/javascript'>
document.write('<a hr'+'ef="ht'+'tp://w'+'ww.mysite'+'.com/1.php">My Site</a>');
</script>
Only I have to be able to subtract .php from the URL, and add _2.html to the final URL




Here is what I am talking about:
Go to this website:
http://tehcake.com/video/30rock/2x14%20-%20Copy.html

Do you see where it says Backup Links: 1 2

I need it to link to http://tehcake.com/video/30rock/2x14%20-%20Copy(2).html
So it does (url of webpage [minus] file extension [plus] (2).html)
it should be in javascript or something that can be written in the webpage.

I'm using <base href> to set my HTML path for links, and chdir() to set PHP's base path.
(Entering site at www.mysite.com/account then resetting my paths back to root for simplicity).

Both of these are working fine, however I've found Javascript ignores <base href> so it's working directory is still a subfolder of root.
OK - so I could add '../' to all Javascript links (which is what I was trying to get away from!) but I've read that it's only IE that ignores <base href> and other browsers accept it.
This will mean my links break unless I either stop using <base href> entirely and go back to using '../' in ALL links, or I can find a way to set Javascript's base link pointer...

This is driving me crazy! Any ideas of how to do it?

I got an index.php
Code:

<html>

<form action="bacakomik.php" method='post'>
<select name="kodekomik">
<option value='../komik1/|23'>Judul Komik1</option>
<option value="../komik2/|20">Judul Komik2</option>
<option value="../komik3/|10">Juduk Komik3</option>
<option value="../komik4/|20">Judul Komik4</option>
</select>
<input type="submit" />
</form>
<?php
echo ('<select>');
echo ('<option value= "'.$i.'">'.'Page '.$i.'</option>');
echo ('</select>');
?>
</html>

As you can see, each of the option brings specific value "../komik1/|23"
komik1 is a directory
| is a delimiter
23 is the pages in one chapter and can be considered also as how many images are there on a specific directory

This is my bacakomik.php
Code:

<?php
$dirkomik = $_POST['kodekomik'];
$exploded = explode("|", $dirkomik);
echo ($exploded[0]); //picture directory
echo ("<br>");
echo ($exploded[1]); //total page in the comic
$pagecount = (int)$exploded[1];
//Take last posted value, process it right away
echo ('<FORM name="guideform"> ');
echo ('<select name="guidelinks">');
$i=1;
do  {
echo ('<option value= "'.$i.'">'.'Page '.$i.'</option>');
$i= $i+1;
}while($i <= $pagecount); //Printing option and select
echo ("</select>");
?>
<input type="button" name="go" value="Go!" onClick="document.getElementById('im').src=document.guideform.guidelinks.options[document.guideform.guidelinks.selectedIndex].value+'.png';"> </FORM>
<img src="img0.jpg" id="im">

With the current code on bacakomik.php, I only can change the img src of id "im" in the same directory only. What I want is that the Javascript could "add" the "$exploded[0]" variable so that the picture can be loaded from different directory. Anyone can do this?
I believe that the fix should be somewhere on input tag inside OnClick, or do you know where?

Anyway, I found this on the net
http://p2p.wrox.com/php-faqs/11606-q...avascript.html
Please help me to those who can...

I'm having a problem with a javascript code I put together. For all of the PHP, CSS, HTML that I know, well it doesn't carry over to JavaScript, so my attempt at trying this is probably a very bad attempt.

Anyways, what I'm trying to accomplish with this code is to get the height of one table and set the padding-bottom to another table, to keep page dimensions even.

Code:

<script type="text/javascript">
var divArray = document.getElementById('tablecontent').offsetheight;
//Subtracting 442 because that's the height of the table. I'm just trying to add onto the bottom.
var subtraction = divarray - 442;
var tablesidebar = document.getElementById('tablesidebar');
tablesidebar.style.paddingbottom = subtraction + 'px';
</script>

Any help to get this working is well appreciated.

Thanks,
Jeremy