{"id":20305100,"url":"https://github.com/avcs06/scaletext","last_synced_at":"2025-03-04T07:20:27.097Z","repository":{"id":134607910,"uuid":"29801397","full_name":"avcs06/ScaleText","owner":"avcs06","description":"Responsive Web Typography","archived":false,"fork":false,"pushed_at":"2015-08-27T12:27:07.000Z","size":820,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-01-14T11:17:48.928Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"http://avcs-tips.com/scaletext/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/avcs06.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2015-01-25T03:35:18.000Z","updated_at":"2015-08-27T12:25:42.000Z","dependencies_parsed_at":"2023-03-10T15:31:27.254Z","dependency_job_id":null,"html_url":"https://github.com/avcs06/ScaleText","commit_stats":null,"previous_names":[],"tags_count":1,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/avcs06%2FScaleText","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/avcs06%2FScaleText/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/avcs06%2FScaleText/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/avcs06%2FScaleText/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/avcs06","download_url":"https://codeload.github.com/avcs06/ScaleText/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":241801778,"owners_count":20022518,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-14T17:07:15.868Z","updated_at":"2025-03-04T07:20:27.076Z","avatar_url":"https://github.com/avcs06.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# scaleText\nScaleText preserves the aspect ratio of Typography still maintaining readability. One doesn’t need to write media queries for scaling text anymore. ScaleText removes code smells and handles font size dynamically in a webpage for any type of display, be it Smartphone or Tablet or Laptop.\n\n# Documentation \u0026 Demo\nPlease \u003ca href=\"http://avcs-tips.com/scaletext/\"\u003eclick here\u003c/a\u003e for Documentation and Demo of scaleText.\n\n# Installation\n\nInclude the js file in your page before ending body tag.\n\nIf you are using Bootstrap 2 or Bootstrap 3, you will have to include the css file in your page before ending head tag.\n\n# Dependency\n\nJQuery\n\n# How to and why should I use scaleText?\n\n### Easy to implement : \nAll you have to do is include scaleText.js in your page. Design your page for a fixed screen size like you usually do, but you don’t have to write any media queries for font-size. Then initialize the plugin for all the elements you want to scale. But please do keep in mind that you have to pass the top level container and the width of it, for which you have designed your page.\n\u003cblockquote\u003e\u003cstrong\u003eExample:\u003c/strong\u003e\nTop level container for this page is 'body' and  I have designed this page for 1349px.\nNow I want to scale all p elements in this page.\n\u003cpre\u003e$('p').scaleText( { container : 'body' , initialWidth : 1349  } );\u003c/pre\u003e\n\u003c/blockquote\u003e\n### Support for Bootstrap Columns : \nIf you are using Bootstrap and you want to scale text which is inside a Bootstrap column, you have to add an extra class \u003cstrong\u003ebootscale{version}-{column width}\u003c/strong\u003e for those columns and include \u003cstrong\u003escaleText.css\u003c/strong\u003e file in the page.\n\u003cblockquote\u003e\u003cstrong\u003eExample:\u003c/strong\u003e\n\u003cpre\u003eBootstrap 3:  col-md-2 bootscale3-2\u003c/pre\u003e\n\u003cpre\u003eBootstrap 2:  span2 bootscale2-2\u003c/pre\u003e\n\u003c/blockquote\u003e\n### Generalized : \nIt works for all types of elements, be it table, inline, block, floated or positioned.\u003cbr/\u003eFont-size calculation is based directly on the element width ( or width of closest block element in case the element takes only content width) instead of screen width.\n### Scaling independent of screen size : \nYou can scale anytime you want independent of window’s resize event using the api function \u003cstrong\u003e$.scaleText()\u003c/strong\u003e . You can pass an element as parameter to this function and it will scale only children of that element. If no parameter is passed it will scale all the elements in the page.\nPS: Elements have to be initialized before, for this function to work.\n\u003cblockquote\u003e\u003cstrong\u003eExample:\u003c/strong\u003e\n\u003cpre\u003e\n$.scaleText(); / $.scaleText('body');\n\u003c/pre\u003e\n\u003c/blockquote\u003e\n# API\n\u003ctable\u003e\n   \u003cthead\u003e\n     \u003ctr\u003e\n       \u003cth\u003eOption\u003c/th\u003e\n       \u003cth\u003eDefault Value\u003c/th\u003e\n       \u003cth\u003eDescription\u003c/th\u003e\n     \u003c/tr\u003e\n    \u003c/thead\u003e\n    \u003ctbody\u003e\n     \u003ctr\u003e\n        \u003ctd\u003econtainer \u003cspan style=\"color:red\"\u003erequired\u003c/span\u003e\u003c/td\u003e\n        \u003ctd\u003e'body'\u003c/td\u003e\n        \u003ctd\u003eTop level container for your page.Initializing elements outside this container will throw error.\u003cbr/\u003eAccepts jQuery selector string, javascript DOM object, jQuery DOM object\u003c/td\u003e\n     \u003c/tr\u003e\n     \u003ctr\u003e\n        \u003ctd\u003einitialWidth \u003cspan style=\"color:red\"\u003erequired\u003c/span\u003e\u003c/td\u003e\n        \u003ctd\u003e1366 (in px)\u003c/td\u003e\n        \u003ctd\u003eWidth of the top level container when you designed the page (or) the width at which font-sizes you have defined should be applied.\u003cbr/\u003e Accepts integer\u003c/td\u003e\n     \u003c/tr\u003e\n     \u003ctr\u003e\n        \u003ctd\u003eminFont\u003c/td\u003e\n        \u003ctd\u003e10 (in px)\u003c/td\u003e\n        \u003ctd\u003eMinimum value for font-size, if the calculated value is less than this value, this value will be set as font-size.\u003cbr/\u003e Accepts integer\u003c/td\u003e\n     \u003c/tr\u003e\n     \u003ctr\u003e\n        \u003ctd\u003emaxFont\u003c/td\u003e\n        \u003ctd\u003e999 (in px)\u003c/td\u003e\n        \u003ctd\u003eMaximum value for font-size, if the calculated value is more than this value, this value will be set as font-size.\u003cbr/\u003e Accepts integer\u003c/td\u003e\n     \u003c/tr\u003e\n    \u003c/tbody\u003e\n\u003c/table\u003e\n\n# Example\n\u003cblockquote\u003eInclude scaleText.js file in the page.\n\u003cpre\u003e\u003cxmp\u003e\u003cscript src=\"../js/scaleText.js\"\u003e\u003c/script\u003e\u003c/xmp\u003e\u003c/pre\u003e\nInitialize scaleText function on all the elements you want to scale\n\u003cpre\u003e\n$('.mainContent,li,blockquote,h2,h3,.page-title,td,th').scaleText({\n    container : 'body' ,\n    initialWidth : 1349,\n    minFont : 10\n});\n\u003c/pre\u003e\nCall the $.scaleText() function to scale text independent of window's resize event.\n\u003cpre\u003e\n$(selector).click(function() {\n    $.scaleText();\n});\n\u003c/pre\u003e\n\u003c/blockquote\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Favcs06%2Fscaletext","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Favcs06%2Fscaletext","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Favcs06%2Fscaletext/lists"}