Mod rewrite page anchor

Question

I've been trying to solve this for the past two hours. I already tried every solution mentioned on google, but without any luck.

Let's start with the problem. I'm trying to use this plugin: http://www.gethifi.com/blog/a-jquery-plugin-to-create-an-interactive-filterable-portfolio-like-ours

on my website. The problem is that this plugin is using Anchor tags. Without it, it doesn't seem to work. Well, I'm trying to work with User Friendly URL's on the website I'm working on right now. So the anchors are not working.

This is my .htaccess file right now:

RewriteEngine On
RewriteBase /
RewriteRule ^([^/]*)\.html$ /mysite/category.php?cat=$1 [L]
RewriteRule ^([^/]*)/([^/]*)\.html$ /mysite/category.php?cat=$1&lang=$2 [L]

Nothing fancy, just some rewrites for categories and languages. The only thing that seems to work is this:

RewriteEngine On
RewriteBase /
RewriteRule ^([^/]*)\.html$ /mysite/category.php?cat=$1 [L]
RewriteRule ^([^/]*)/([^/]*)\.html$ /mysite/category.php?cat=$1&lang=$2 [NE,R,L]

But my User Friendly URL is also gone when I use this. Instead I see: category.php?cat=....

I don't know if this is important but I use <base href=""> to point to the host I'm working on.

Thanks in advance for any ideas.

@Pekka: I bet if he gotten redirect instead of just "not working" - he would see it and he would specify it in the question ;-) — zerkms, Dec 17 '10 at 00:50
@Pekka: No it doesn't seem to work. @Zerkms: Well how about: Nothing is happening at all. The url is changed properly to the anchor, but I need to refresh the page manually to see the effect taking place. If you need any more information, I'll be glad to provide it. Thanks for your time. — moonwalker, Dec 17 '10 at 00:57
@moonwalker can you show an example of an URL with an anchor? Because the `#xyz` part shouldn't affect URL rewriting at all, it is used on the browser side only. The base tag may be the culprit here then — Pekka, Dec 17 '10 at 01:04
@Pekka: Of course. Here you go: http://localhost/mysite/stars.html#fr http://localhost/mysite/stars.html#nl http://localhost/mysite/stars.html#all When I hit the anchor link, the address is changed properly. But the "cool" fadeIn effects are not visible, only if I refresh the page. I'm still trying to figure out a solution for this. Thanks again for your time. — moonwalker, Dec 17 '10 at 01:18

score 1 · Answer 1 · answered Dec 21 '10 at 01:12

1

Anchor # is an URL fragment, apache will ignore and not cater for rewrite.

Using client approach is the only workaround.

Or you can try PHP parse_url - PHP_URL_FRAGMENT

answered Dec 21 '10 at 01:12

ajreal

46,720
11
89
119

moonwalker · Accepted Answer · 2010-12-20T22:05:11.413

Couldn't find a way to make the plug-in work in combination with mod_rewrite, so I just gave up and used another plug-in. It seems to work find, since it doesn't need an anchor to work with.

Peace.

Edit:

This is the code I'm using right now:

        $(document).ready(function() {

            $('.menu li a').click(function() {


                $('.menu li').removeClass('selected');
                $(this).parent('li').addClass('selected');

                thisItem    = $(this).attr('rel');

                if(thisItem != "all") {

                    $('.item li[rel='+thisItem+']').stop()
                                                            .animate({'width' : '110px', 
                                                                         'opacity' : 1, 
                                                                         'marginRight' : '.5em', 
                                                                         'marginLeft' : '.5em'
                                                                        });

                    $('.item li[rel!='+thisItem+']').stop()
                                                            .animate({'width' : 0, 
                                                                         'opacity' : 0,
                                                                         'marginRight' : 0, 
                                                                         'marginLeft' : 0
                                                                        });
                } else {

                    $('.item li').stop()
                                    .animate({'opacity' : 1, 
                                                 'width' : '110px', 
                                                 'marginRight' : '.5em', 
                                                 'marginLeft' : '.5em'
                                                });
                }
            })

            $('.item li img').animate({'opacity' : 0.5}).hover(function() {
                $(this).animate({'opacity' : 1});
            }, function() {
                $(this).animate({'opacity' : 0.5});
            });

        });

I just changed it from list to divs.

Care to tell the world which plugin you used that worked for you? Maybe other people will run into the same question ... — Select0r, Dec 17 '10 at 15:22
@Select0r: I apologize, didn't think about putting the solution here. Greetz. — moonwalker, Dec 20 '10 at 22:05

Mod rewrite page anchor

2 Answers2

Linked