Home/ Questions/Q 6153931
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-23T20:10:34+00:00

How can it be that typeface.js doesn’t "rewrite" when you press a new href

  • 0

How can it be that typeface.js doesn’t "rewrite" when you press a new href?

If you remove typeface-js from the class it works.

Live link: http://temp.electrobeat.dk/typeface.php

updated function:

            function generate_menu(page){
                var menu = {
                    posting : {
                        title : 'Posting'
                    },
                    account : {
                        title : 'Account'
                    }
                };
                
                var elm = $('#div_menu').empty();
                for(var key in menu){
                    (function(key){
                        $('<a class="typeface-js menu '+(key == page ? 'menu_active':'')+'" href="#'+key+'">'+menu[key].title+'</a>').appendTo(elm)
                            .click(function(){
                                generate_menu(key);
                            });
                    })(key);
                }
                _typeface_js.initialize();
            };

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
 "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
        
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js" type="text/javascript"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.12/jquery-ui.min.js" type="text/javascript"></script>
        
        <script src="typeface-0.15.js" type="text/javascript"></script>
        <script src="arial_bold.typeface.js" type="text/javascript"></script>
        <script type="text/javascript">
            $(document).ready(function(){
                function generate_menu(page){
                    var menu = {
                        posting : {
                            title : 'Posting'
                        },
                        account : {
                            title : 'Account'
                        }
                    };
                    
                    var elm = $('#div_menu').empty();
                    for(var key in menu){
                        (function(key){
                            $('<a class="typeface-js menu '+(key == page ? 'menu_active':'')+'" href="#'+key+'">'+menu[key].title+'</a>').appendTo(elm)
                                .click(function(){
                                    generate_menu(key);
                                });
                        })(key);
                    }
                };
                
                generate_menu('posting');
            });
        </script>
        
        <style type="text/css">
            #div_menu {
                background:#ff0000;
                padding:5px;
            }
            
            .menu {
                font-family:arial;
                font-size:14px;
                color:#e8f5ff;
                font-weight:bold;
                border-bottom:3px solid transparent;
                text-decoration:none;
                padding:1px 2px 2px 2px;
                margin:0px 2px 0px 2px;
            }
            
            .menu_active {
                color:#07447c;
                border-bottom:3px solid #e8f5ff;
            }
        </style>
    </head>
    
    <body>
        <div id="div_menu"></div>
    </body>
</html>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    The problem is that you’re removing the elements and then adding them again, but typeface.js only runs once on the page. If you are doing this you need to manually retrigger typeface.js’s method, which might be:

    _typeface_js.initialize();

    Put this (or whichever method it turns out to be) in your generate_menu method after attaching the elements.

    • 0