Javascript to hide the Table of Contents

  • Resolved James I.

    (@nootropixcom)


    8 years, 1 month ago

    Hi,
    I want to collapse the table of contents on mobile by default because it takes up too much space. What is the javascript function to toggle the state of the TOC container?

Viewing 1 replies (of 1 total)
  • Steven

    (@shazahm1hotmailcom)

    There is not a function, but here is the code which you could use to write your own:

    
if ( typeof ezTOC.visibility_hide_by_default != 'undefined' ) {

			var toggle = $( 'a.ez-toc-toggle' );
			var invert = ezTOC.visibility_hide_by_default;

			if ( Cookies ) {

				Cookies.get( 'ezTOC_hidetoc' ) == 1 ? toggle.data( 'visible', false ) : toggle.data( 'visible', true );

			} else {

				toggle.data( 'visible', true );
			}

			if ( invert ) {

				toggle.data( 'visible', false )
			}

			if ( ! toggle.data( 'visible' ) ) {

				$( 'ul.ez-toc-list' ).hide();
			}

			toggle.click( function( event ) {

				event.preventDefault();

				if ( $( this ).data( 'visible' ) ) {

					$( this ).data( 'visible', false );

					if ( Cookies ) {

						if ( invert )
							Cookies.set( 'ezTOC_hidetoc', null, { path: '/' } );
						else
							Cookies.set( 'ezTOC_hidetoc', '1', { expires: 30, path: '/' } );
					}

					$( 'ul.ez-toc-list' ).hide( 'fast' );

				} else {

					$( this ).data( 'visible', true );

					if ( Cookies ) {

						if ( invert )
							Cookies.set( 'ezTOC_hidetoc', '1', { expires: 30, path: '/' } );
						else
							Cookies.set( 'ezTOC_hidetoc', null, { path: '/' } );
					}

					$( 'ul.ez-toc-list' ).show( 'fast' );

				}

			} );
		}
Viewing 1 replies (of 1 total)
  • The topic ‘Javascript to hide the Table of Contents’ is closed to new replies.