Wikipedia Viewer
How do I make an wikipedia viewer?
What is a wikipedia viewer? How do you make a wikipedia viewer? This script and codes were developed by Arbauman on 16 September 2022, Friday.
Wikipedia Viewer - Script Codes HTML Codes
<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Wikipedia Viewer</title> <link rel='stylesheet prefetch' href='https://cdnjs.cloudflare.com/ajax/libs/bulma/0.4.0/css/bulma.min.css'> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div id="app"> <section class="hero is-primary is-bold is-fullheight"> <div class="hero-body"> <div class="container"> <div class="columns"> <div class="column is-12"> <div class="field is-grouped"> <div class="control is-expanded"> <input class="input" type="text" v-model="query"/> </div> <div class="control"> <a class="button is-fullwidth" target="_blank" href="https://en.wikipedia.org/wiki/Special:Random">Random</a> </div> </div> <div class="columns is-multiline is-mobile"> <div v-for="result in results" class="column is-12"> <a target="_blank" :href="url(result.pageid)"> <div class="notification is-primary"> <span class="title">{{ result.title }}</span> <span class="content is-small"><p>{{ result.extract }}</p></span> </div> </a> </div> </div> </div> </div> </div> </div> </section>
</div> <script src='https://cdnjs.cloudflare.com/ajax/libs/vue/2.2.4/vue.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js'></script> <script src="js/index.js"></script>
</body>
</html>
Wikipedia Viewer - Script Codes CSS Codes
.container { padding: 50px; width: 600px;
}
.button { color: #282A2E !important;
}
.hero.is-fullheight .hero-body>.container { flex-grow: 0;
}
Wikipedia Viewer - Script Codes JS Codes
'use strict';
new Vue({ el: '#app', data: { query: '', results: [] }, watch: { query: function query() { this.search(); } }, methods: { url: function url(id) { return 'https://en.wikipedia.org/?curid=' + id; }, search: _.debounce(function () { var vm = this; $.ajax({ url: 'https://en.wikipedia.org/w/api.php?format=json&action=query&generator=search&gsrnamespace=0&gsrlimit=10&prop=pageimages|extracts&pilimit=max&exintro&explaintext&exsentences=1&exlimit=max&gsrsearch=' + vm.query, dataType: 'jsonp', success: function success(x) { vm.results = []; Object.keys(x.query.pages).forEach(function (key) { vm.results.push(x.query.pages[key]); }); } }); }, 500), getArticles: function getArticles(query) {} }
});
//https://en.wikipedia.org/w/api.php?format=json&action=query&generator=search&gsrnamespace=0&gsrlimit=10&prop=pageimages|extracts&pilimit=max&exintro&explaintext&exsentences=1&exlimit=max&gsrsearch=
Developer | Arbauman |
Username | arbauman |
Uploaded | September 16, 2022 |
Rating | 3 |
Size | 2,991 Kb |
Views | 32,384 |
Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!
Name | Size |
Javascript 30 - Day 3 | 2,453 Kb |
Vue 2.0 - Conditionals and Lists | 1,803 Kb |
Javascript 30 - Day 5 | 2,920 Kb |
Vue 2.0 - Inserted variables | 1,692 Kb |
Vue 2.0 - Simple components | 1,856 Kb |
FreeCodeCamp - Portfolio | 2,117 Kb |
Javascript 30 - Day 2 | 2,639 Kb |
FreeCodeCamp - Local Weather | 3,296 Kb |
Javascript 30 - Day 1 | 2,860 Kb |
Vue 2.0 - Inputs and dynamic styling | 1,725 Kb |
Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!
Name | Username | Size |
Rotating Preloader with Anime.js | Tamashi | 2,450 Kb |
A Pen by Tosh | Panev | 2,586 Kb |
Vue Transition | Chenming142 | 4,561 Kb |
My Starter Kit For Codepen | Dkdesign | 2,012 Kb |
Commuter Line Tokyu 8500 | Pedox | 7,031 Kb |
Simple blog concept | Drew_mc | 2,666 Kb |
AngularJS Skills | Supro | 3,312 Kb |
Hoi hoi | JohnTheCat | 7,248 Kb |
My three.js practice | Esambino | 3,203 Kb |
LAMP PURE CSS with Animation | Dam62500 | 2,911 Kb |
Surf anonymously, prevent hackers from acquiring your IP address, send anonymous email, and encrypt your Internet connection. High speed, ultra secure, and easy to use. Instant setup. Hide Your IP Now!