I'm trying to create a type of virtual pagination that's simple, semantic, and SEO friendly. The concept is like this website: [URL] In the bottom right hand corner, if you select a city, different contact information appears. My theory is to assign a class name to the hyperlink, then have a DIV with a matching ID.
[Code]....
Nothing works yet, and I don't know where to continue. The DIVs aren't even hidden upon loading.
How can I implement a simple virtual keyboard for a website... the only things I need is a number pad(0 -9)...
is a way to implement it as simple as possible using the Javascript...
I was wondering if someone could help me. I successfully implemented a number of sortable lists, using a table in html. However I wanted to table cells to be scrollable, which does not apparently work, I tried overflow: auto;, overflow: hidden; and overflow: scroll; in css and it did not work, the table cells kept moving to fit the draggable content. I checked on the internet and found that as stated, table cells cannot be made scrollable. Therefore I decided to do it all with div elements. However I want the div elements structured in a 5 x 3 format. Therefore I thought I would implement it in dom. However I am a newby to dom. I have created the following code, which is simple but repetitive, the function createTable simply creates the div elements (1,2,3,4,5...) and writes the class and id attributes to each. I then appended several of the elements into a div container I created, called divcontainer with a class right. There is also a div element already in the document, class and id = 'right'. I therefore tried to add the divcontainer to this. The function however is causing a page error and none of the dom div elements areI would simply prefer to create the divcontainer and append the div elements. Should I take out the div element right already in the document and instead use something like document.body.appendChild(divcontainer) or something similar. Also the function call createTable() should I use window.onload = function(){} instead.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 3.2//EN">
<HTML>
<HEAD>
[code]....
I'm quite novice at javaScript but I have a good background in other similar languages, so I find I pick up things quick. Basically I'm planning on reading through some more solid resources on this topic, but I'm kinda under the pump at the moment for something that I imagine wouldn't be too difficult with a lil nudge in the right direction.
I have a form (using PHP) to update a mySQL database AND XML for flash, for a simple news page. At the moment I have the BBcode style of tags ([b][eb]). I was wondering how I can make a rich editor myself with just three buttons (one for italic, one for bold, one for links) that displays the text on screen to the user as WYSIWYG, and outputs the [b] [eb] tags for my PHP code.
In Salesforce, I am adding what they call an "S-Control" via HTML/JavaScript that will display an alert if certain field criteria are met. The alert would be a reminder to hit the "Submit for Approval" button if the Quote Estimate is equal to or greater than $50,000. For testing purposes I added another criteria, that the Opportunity name must = Test and Stage must = Proposal/Price Quote.
Here's what I've come up with so far, taking from other examples, but I receive no alert
<html>
<head>
<script type="text/javascript" language="javascript" src="/js/functions.js"></script>
[Code]....
I'm using the following guide to create a horizontal accordion:[URL].. And it seems to be working great, see the accordion in the footer:[URL].. Only problem is, I can't seem to add any anchor tags inside the <p> elements! The script seems to move them out of the paragraph and add them after it as siblings. I cannot see anything in the code that might do this (but then again, I'm not a JavaScript expert).
[Code]...
I have an interesting problem. I have created an html based interface that
links to an external .js file with only functions in it. The functions set
an arrays values depending on which function is called by the interface....
The external .js file looks like this below:
function myFunction1(){
arryEntry[0] = "some value1";
arryEntry[1] = "some value2";
arryEntry[2] = "some value3";
arryEntry[3] = "some value4";
}
function myFunction2(){
arryEntry[0] = "other value1";
arryEntry[1] = "other value2";
arryEntry[2] = "other value3";
arryEntry[3] = "other value4";
}
etc...
In the html interface I am calling the function(s) depending on a list
selection. This functions one arg (functionNumber) depends on a list
selection.
function getArryEntries(functionNumber){
eval("myFunction"+parseInt(functionNumber)+"()");
var value0 = arryEntry[0];
var value1 = arryEntry[1];
var value2 = arryEntry[2];
var value3 = arryEntry[3];
}
This all works well so far and the array entries are changed successfully
depending on the getArryEntries(functionNumber) selection.
However, at some time in the session I am adding (actually writing)
additional functions to the external .js file. Appending to the file. The
problem is that the interface will not pick up the newly written functions
on runtime. If the interface is closed and opened again, then it can see the
new functions.
I thought of initiating an array of the existing functions when the
interface loads and append to the array when the new functions are created.
It would then write to the file, but use the array at runtime. No success so
far.
This function will produce a URL that appears to be a file.
There are two versions:
1. a 500-pound gorilla version that accepts almost anything as input.
2. a lightweight version that turns strings into virtual HTML files.
First I'll mention the one major drawback: IE doesn't recognize data urls (http://en.wikipedia.org/wiki/Data:_URI_scheme) yet.
For a Live Demo, paste this into your addressbar and click go. (press back to return).
data:text/html;charset=utf-8;base64,PGI+aGVsbG8gd29ybGQ8L2I+
//output of: dataUrl("<b>hello world</b>", "text/html")
With that out of the way, here's the code:
function dataUrl(data, mimeType){ // turns a string into a url that appears as a file. (to ff/op/saf)
encType= (!!btoa) ? ";base64" : "";
var esc = (!!encType) ? function(d){return btoa(d);} : function(d){return escape(d);};
if(!mimeType){mimeType= (data.nodeName) ? "text/html" :"text/plain";};
b="data:"+mimeType+";charset="+document.characterSet+"+encType+",";
if ("string number date boolean function".indexOf(typeof data) > -1){ b+=esc(data.toString()); return b; };
if ( data.constructor==Array){b+= esc( data.join("") );return b; };
if(typeof data=="xml"){b+=esc(data.toSource()); return b;} //FF2 xml frag/doc
//for more complicated data, attempt to determine the format.
if(typeof data=="object"){
if(!!data.value && !!data.value.length){b+=esc(data.value); return b;}; //input tags w/content
if(!!data.innerHTML){b+=esc(data.innerHTML); return b;} //HTML tag
if(!!data.length){ //weird stuff like nodelists
var G=function(ob){r=[]; i=0;
for(i;i<ob.length;i++){
if(dataUrl(ob)) r=dataUrl(ob[i]);} return r.join("
");};//end g
return(b+G(data));}//end if object w/length
if(!! eval(data.toSource()) ){b+=esc(data.toSource()); return b;}; //JSON
}//end if object
return;
} //end function dataUrl
function dataUrlStr(data){ return ("data:text/html,"+escape(data));}
Usage: dataUrl(data, mimeType)
data- The desired contents of the file
mimeType- The type of content you want the browser to see.
output: An encoded string representation of the file; an href.
The output 'file' could be any text-based file format, depending upon what you set mimeType to be:
-HTML document (yawn) (text/html)
-Rss feed (text/xml)
-M3U playlist (audio/mpegurl)
-Excel spreadsheet, CSV (application/vnd.ms-excel)
-JavaScript (text/javascript)
-StyleSheet (text/css)
- You get the idea...
Input Details:
-Can accept [I]almost any javascript type: strings, numbers, arrays (which it will flatten), nodes, node lists, xml objects in FF2, functions (for which it outputs the source code), complex JSON objects, and dates. (whew, I think that's all of 'em...)
-if you want to output an element as html, or anything else as text, you can skip the mimeType argument.
Notes:
-You will most likely want to assign the output to a link href or the .scr of a script, stylesheet, or iframe, or to window.location.href.
-If you assign it to an iframe or object, it will load immediately.
-assigning it to a (<a>) tag will let you 'right-click, SaveAs' the file.
-clicking the link will open the 'file' in the browser just like a regular file.
-output an html document that has scripts, and they execute immediately.
-the cool thing about this is that the script will have a clean context. (no global variables from the parent).
-if used in an iframe- it can push to main page via window.top .
-if used in with an <object>, it will be completely private.
Caveats:
-doesn't work with IE yet.
-'saving As' doesn't offer a default file extention.
-there is 2kb limit for safari and opera URLs.
-search engines cannot see the links.
-XmlHTTP Requests from within usually don't work.
Examples:
To save my fingers, I will utilize the follow shortcut functions in these examples:
function el(tid) {return document.getElementById(tid)};
function tags(tid) {return document.getElementsByTagName(tid)};
//test
tags("a")[0].href=dataUrlStr("<b>Hello World!</b>")
//make a 2D array into an Excel SpreadSheet - (works with 1D lists also)
var grades= [["Subject" , "Grade"],
["Math", "A" ],
["English", "B+" ],
["Gym","C" ],
["Art","A-" ],
["Science","A+" ] ]
var exl=grades.join("
").toString().replace(/,/g , " ")
window.location.href=dataUrl(exl, "application/vnd.ms-excel")
//note: if data contains commas: loop through main, .join(' ') each index.
//execute script in a fresh enviroment:
window.testme="123456789"; //make a new global
var testJs="<script>alert('hidden window.testme='+ window.testme )</script>";
var fr= document.createElement("iframe");
fr.id="hiddenframe";
fr.style.display='none'
document.body.appendChild(fr); //add a hidden frame
alert("main window.testme="+window.testme);
el("hiddenframe").src=dataUrlStr(testJs);
//re-using the above example, pass existing functions to the hidden frame, and return the result.
var tJs="<script>";
tJs+=[tags, el].join("
"); //bundle a couple functions
tJs+="
alert('hidden window has '+tags('*').length)"
tJs+="</script>";
el("hiddenframe").src=dataUrlStr(tJs)
//open a playlist
var plTxt="#EXTM3U
#EXTINF:202,Minuet in G
http://www.mfiles.org.uk/downloads/beethoven-minuet-in-G.mp3"
el("hiddenframe").src=dataUrl(plTxt, "audio/mpegurl"
//open all the 'code' on this page as a plain text document.
function ob2Array(ob){var r=[]; for(var z=0; z<ob.length;z++){r[z]=ob[z]};return r};
function group( List, f) //applies a function (f) to an array and returns result...
{var z=0; Ray=[]; len=List.length;for (z;z<len;z++){Ray[Ray.length]=f(List[z]); }
return Ray;};
var codes=group(ob2Array(tags("pre")), function(x){if(x.className=="alt2")return x.textContent});
window.location.href=dataUrl(codes)
//make this thread into an rss feed
function tag(nd, tx){ return ["<",nd,">",tx,"</",nd,">"].join("")}
function dp (s) {var d = new Date();d.setTime(Date.parse(s)); return d.toUTCString()}
var X=PHP.htmlspecialchars
var chan=[]; var y = new Date();
chan[0]=tag("title", "CodingForums.com");
chan[1]=tag("link", window.location.href);
y.setTime(ajax_last_post+"000")
chan[2]=tag("pubDate", y.toUTCString())
chan[3]=tag("link", "http://www.codingforums.com/")
var codes=Group(ob2Array(tags("table")), function(x){
var i=[];d=""; p=d; t=d; l=d;j=d;a=0;
if(x.id.substr(0,4)=="post"){
p=tag("pubDate", dp(x.rows[0].cells[0].textContent.replace(/-/g, "/")));
t=tag("title", document.title)
l=tag("link", "http://www.codingforums.com/showpost.php?p="+tags("table")[5].id.substr(4))
ta=x.rows[1].cells[0].getElementsByTagName('a')[0]
a="<author>"+ta.href+" ("+ta.textContent+") </author>";
d=X(x.rows[1].cells[1].textContent.toString())
j=[d,t,p,l,a].join("
");
return tag('item', j)
}//end if
});
tags("a")[2].href=dataUrl(tag("channel", chan.join("
") + codes), "text/xml")
So, i think that should be enough examples to get going.
[I]"The only limitation is your imagination"
Here is a virtual train set I've made. To place a piece, select it from the drop-down and click 'Go!'. The train will always start on the top-right hand square, then go right.
When you open the page, enter how many rows and columns there should be in the grid: the default is 16 X 16.
I started studying javascript when I decided that I wanted to create a dynamic webpage after viewing some books that were made to pageflip with Javascript and after viewing a ton of animations. So I figured since everyone keeps saying Javascript is simple that if all I wanted to do was to make a book extend outwards on mouseover and then open up on click and flip pages which they already have a code for that it wouldn't be so difficult. I've read everything I could practiced a little bit, I'm not fluent but I do have a goal and a time. The problem for me comes up with figuring out what I need to do in order to make it appear as if the book is coming out of a book shelf. There is a lot of information on animations where flat objects rise above clouds.
I am thinking that I would have to use some sort of sprite of a row of books both sorta sideways where you can see the side of the book as well as the edge, and both a row of books on a shelf, or perhaps a row of books with some of the books being pulled out and then on mouse over animate the scene so that it looks like the book is being pulled out. Would that work? Or is there a simpler way? Another way or I don't know. Is there a code that can make it look like a book is extending outwards without an animation or would I need to create an animation for that?
How is it possible to define a constant in a virtual class?
E.g. I wrote the following code
tml = {
sayHello : function()
{
alert('hello');
}}
now if I want to add a constant into tml virtual class, what I need to
do?
I tried something like
tml = {
const1 : Integer = 0,
sayHello : function()
or
tml = {
const1 : function(){return 0;},
sayHello : function()
in both case, trying to get - inside tml object - the value of
const1 ... it results in a Object value and not the Integer value I
need.
I am doing a virtual point of sales page. Once the user has paid, he should be readdressed to the original web page. But this doesn't happen. I have realized the payment bank code is window.opener.location='[URL]'. I have copied their code and changed that by window.open ("[URL]") and it perfectly works. I have replicated the situation in these links...
The one that doesn't work [URL]
And the one I have modified and works [URL]
They insist their code is ok. Obviously I cannot modify their code located in their server.
I am so stuck on making a virtual keyboard using jquery. I found a great tutorial on nettuts however it requires you to click the letters on the virtual keyboard instead of using your actual keyboard and typing it. Does anybody know any tutorials that offer that or any suggestions? I know i have to use the keydown method but I really don't understand it. Here is an example of what it is suppose to be.
View 2 Replies View RelatedI would like to take current page (which has virtualpaginate numbers below the images to advance through them) and instead of having numbers, to have thumbnails which will be across the bottom of the page (in the footer div)... I will have about 35-40 thumbnails and I'd like it so that the thumbnails correspond to the image that is displayed. I also would like to have the thumbnails be a "slider" type of script which allows the user to browse through the thumbnails by moving their mouse left-and-right. The image in the center DIV (and its accompanying information) should be replaced OnClick, not on hover over the thumbnails.
Here is my current code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[URL]]"> <html xmlns="[URL]"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Viviana Santamarina</title>
<style type="text/css"> html, body { background-color: #111; width: 1100px; margin-right: auto; margin-left: auto; margin-top: 50px; padding: 0px; border: 0px; } .....
How I can have the thumbnails in the footer DIV change the picture in the "portfolio" div just like my virtualpaginate numbers currently do.
Did anyone implement or can direct me to an implementation of virtual mode (render only visible rows, but still have the scroll work right) or something similar in the AJAX Sys.Preview.UI.Data.ListView?
I need to display a very large table (`1000 rows) and it simply isn't feasible to render everything.
My Page allows the following functionality...(ASP.NET)
1.When a userscrolls the gridview downwards fresh data is retrieved from a web service and appended to the grid.
2.Clicking the checkbox of a row selects the current row and creates a clone rowand appends it toa bottom grid.
The Problem:
The problem is that clicking the selected checkbox does not append it to the grid at the bottom. Now the funny part is that the data which is displayed in the initial load is appended to the bottom grid when checked but the fresh Data which is loaded is not appended to the bottom grid when checked.
I have a background that is a shelf full of books, I wanted to figure out what I would need to do in order to make a random number of books pop out on mouse over (individually), and upon click have the book pulled out and be flipped through and read like a book. Would I have to recreate the library picture completely to make the random books moveable? And would I have to create the books that I want to move from the bookshelf?
how to pull the book out from the book shelf so that it looks like it's coming towards me and then to make it look like it has been pulled out. Would I need to use animation for this? What would be the parts to the animation required?
A little background on my knowledge of javascript: I understand the concepts of it and can understand it when I read it or its explained to me. I am looking to create something as simple as I can, I thought having a background and something basic like a few books be able to pop out. When I realized css couldn't do this and css3 wasn't supported by most browsers I turned to javascript and have been trying to figure out the steps I would need to do to do this specifically.
I'm hunting around for a decent javascript pagination scirpt that can break a long article up into variables and offer pagination options on a standard html page.
I've seen various ajax options that receive feeds from external pages but this isn't suitable (hotscripts, dynamic drive etc...). Neither do I wish to give the pages I wish to paginate a php extension as that would sit out of the flow of my site.
Can anyone recommend a simple to use pagination script based in javascript and compatible on a html page?
I am using jquery ajax and webmethods in asp.net(C#).i can display data..i only want pagination. can anyone have complete example?
View 2 Replies View RelatedI have a table with a list of items which currently show 8 items per page. I want to have an input box at the top of the page so if I want a different amount of items to be shown i enter the number and the page alters the pagination to what ever number is entered.
View 7 Replies View RelatedI need a small pagination on a page like this one [URL]
But I don't want to pull in the content from external pages, I'd rather it all be on the same page with most of it hidden... Ideally I'd like to use a list to display 10 items at a time, and when any more than 10 items are inserted you would get numbered tabs with which the user could interact with as in the example above...
Is this even possible? It doesn't have to be a list of items if this complicates things...
Is it possible to use javascript to populate the drop down menu instead of hardcoding? I already called the images dynamically and all, but I don't know how to call the drop down menu dynamically based on the images uploaded to my folder.I'm also having trouble scripting the pagination for my code. I don't know how to display my images in boxes that has same distance between each and shows only 6 to 8 images at a time. Since right now, my images are all stuck together next to each other with out a border between or being centered and showing all images.I'm new to javascript and have been stuck on this for about 2 weeks now.
View 1 Replies View RelatedI am having a jsp which is listing more than 50 records. I would like to have a page pagination to the table. I have been advised with javascript. So, how can I do that in an easiest way?
View 2 Replies View RelatedI have an API which returns a JSON structure which I display as the result a list of records according to structure This API is called from the server side I would like to display this result with pagination with 20 records per page I would like to know how to use jquery pagination plugin to display this result with pagination with previous, next, first page, last page options
View 1 Replies View RelatedHere is my Code
$(function () {
showData();
});
function showData() {
$.ajax({
type: 'POST',
url: 'CityList.aspx/GetCityList',
contentType: 'application/json; charset=utf-8',
dataType: 'json',
success: function (msg) {
var div = $('#Result').empty().append('<tr><td>#</td><td>Name</td>' +
'<td>KeyWords</td><td>Edit</td><td>Delete</td></tr>');
//loop each record
for (var i = 0; i < msg.d.length; i++) {
div.append('<tr><td>' + msg.d[i].CITYID + '</td>' +
'<td>' + msg.d[i].CITY + '</td><td>' + msg.d[i].Keywords + '</td>' +
'<td><button type="button" class="edit">Edit</button></td>' +
'<td><button type="button" class="delete">Delete</button></td></tr>');
}}}); //end of display }
How I can show 5 records and then pagination for more records. Mean 5 record per page.
My issue here is that the click event (edit) will work on page one but it won't when there's more than one page. What I need to do is add the click event to each page and I'm not sure where I need to accomplish this at.
Code:
<?php
// Include the database page
include ('../inc/dbconfig.php');
$query = "SELECT
[Code].....
