CN107832318A - Content edition method and system based on webpage - Google Patents
Content edition method and system based on webpage Download PDFInfo
- Publication number
- CN107832318A CN107832318A CN201710467325.4A CN201710467325A CN107832318A CN 107832318 A CN107832318 A CN 107832318A CN 201710467325 A CN201710467325 A CN 201710467325A CN 107832318 A CN107832318 A CN 107832318A
- Authority
- CN
- China
- Prior art keywords
- module
- content
- breviary
- frame object
- layer
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Pending
Links
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/958—Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
Landscapes
- Engineering & Computer Science (AREA)
- Databases & Information Systems (AREA)
- Theoretical Computer Science (AREA)
- Data Mining & Analysis (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
The invention discloses the content edition method based on webpage：Including building ccf layer, content frame object-order adjustment layer is ejected in the triggering that response user adjusts button control to the content frame object-order；Wherein, the content frame object-order adjustment layer includes the breviary module of each of the corresponding content module object framework and at least one renewal button control；Operation of the user to the breviary module is responded, adjusts the attribute in the content frame object-order adjustment layer of the breviary module independently of the ccf layer until listening to the triggering to the renewal button control；And close the content frame object-order adjustment layer and the attribute based on the breviary module updates the attribute of at least two content modules object framework in the embedded region in the ccf layer.The present invention more convenient can carry out typesetting to content.
Description
Technical field
The present invention relates to editing machine technology, more particularly to the editing machine technology based on webpage.
Background technology
Traditional editing machine is content editor, the energy lost time very much during picture and text mixing in editing process, is arranged
The version time is very long, completes to edit and can have not meeting on overall article pattern after delivering, can have article when changing again
Number of words length is inconvenient to edit or can not find corresponding editor position.
The content of the invention
Some embodiments of the present application disclose a kind of content edition method based on webpage：It includes building ccf layer,
The ccf layer includes module frame object embedding region and for being embedded in the module frame object embedding region
At least one module frame object addition control of a few module frame object, wherein the embedded region includes at least two
Content module object framework；The ccf layer also includes content frame object-order display layer block, and the content frame object shows
Show that layer block includes content frame object-order adjustment button control；Respond user and button is adjusted to the content frame object-order
The triggering ejection content frame object-order adjustment layer of control；Wherein, the content frame object-order adjustment layer includes corresponding
The breviary module of each of the content module object framework and at least one renewal button control；User is responded to institute
The operation of breviary module is stated, independently of the ccf layer adjustment breviary module in the content frame object-order
The attribute of adjustment layer is until listen to the triggering to the renewal button control；And close the content frame object-order and adjust
Flood and attribute based on the breviary module update described at least two in the embedded region in the ccf layer
The attribute of content module object framework.
Some embodiments of the present application disclose a kind of content editing systems based on webpage：It includes pointer monitoring portion,
For monitoring the various triggerings and movement of pointer；Framework layer building portion, the ccf layer include module frame object embedding area
Domain and at least one module for embedded at least one module frame object in the module frame object embedding region
Object framework adds control, wherein the embedded region includes at least two content module object frameworks；The ccf layer also wraps
Content frame object-order display layer block is included, the content frame object display layer block includes the adjustment of content frame object-order and pressed
Button control；Content frame object-order adjustment layer generating unit, it responds user and adjusts button to the content frame object-order
The triggering ejection content frame object-order adjustment layer of control；Wherein, the content frame object-order adjustment layer includes corresponding
The breviary module of each of the content module object framework and at least one renewal button control；Breviary module category
Property adjustment portion, it responds operation to the breviary module of user, and the breviary module is adjusted independently of the ccf layer
The attribute in the content frame object-order adjustment layer until listen to it is described renewal button control triggering；And frame
Described in rack-layer update section, its described content frame object-order adjustment layer of closing and the attribute based on the breviary module update
The attribute of at least two content modules object framework in the embedded region in ccf layer.
The other embodiment of the application discloses a kind of computer-readable medium, is stored thereon with computer instruction sequence
Row, the computing device sequence of computer instructions can realize the content edition method based on webpage.
Can quickly and conveniently Suitable content according to content edition method of the embodiments herein based on webpage and system
Order, and edit and adjust one or more layers generation only on ccf layer, directly implementation is to frame after completing the editing
Rack-layer.
Brief description of the drawings
Fig. 1 is the ccf layer interface schematic diagram according to the content editor based on webpage of embodiments herein.
Fig. 2 is a kind of structure that bed boundary is adjusted according to the order of the content editor based on webpage of embodiments herein
The schematic diagram of type；
Fig. 3 is the another kind that bed boundary is adjusted according to the order of the content editor based on webpage of embodiments herein
The schematic diagram of configuration；
Fig. 4 is that have one kind according to the order of the content editor based on webpage of embodiments herein adjustment bed boundary
The schematic diagram of configuration；
Fig. 5 is the summary layer that bed boundary is adjusted according to the order of the content editor based on webpage of embodiments herein
Schematic diagram；And
Fig. 6 be according to the order of the content editor based on webpage of embodiments herein adjust bed boundary module it is suitable
The schematic diagram of sequence change；And
Fig. 7 is the schematic diagram of module frame object-order adjustment function
Embodiment
It should be mentioned that some exemplary embodiments are described as before exemplary embodiment is discussed in greater detail
The processing described as flow chart or method.Although operations are described as the processing of order by flow chart, therein to be permitted
Multioperation can be implemented concurrently, concomitantly or simultaneously.In addition, the order of operations can be rearranged.When it
The processing can be terminated when operation is completed, it is also possible to the additional step being not included in accompanying drawing.The processing
It can correspond to method, function, code, subroutine, subprogram etc..
Alleged within a context " server " refer to can by run preset program or instruction come perform numerical computations and/
Or the intelligent electronic device of the predetermined process process such as logical calculated, it can include processor and memory, by computing device
The programmed instruction to prestore in memory makes a reservation for perform predetermined process process, or by the execution of the hardware such as ASIC, FPGA, DSP
Processing procedure, or realized by said two devices combination.
Wherein, the user equipment includes but is not limited to smart mobile phone, PDA, PC, notebook computer etc.；The network is set
For including but not limited to single network server, the server group of multiple webservers composition or based on cloud computing (Cloud
Computing the cloud being made up of a large amount of computers or the webserver), wherein, cloud computing is one kind of Distributed Calculation, by
One super virtual computer of the computer collection composition of a group loose couplings.Wherein, the computer equipment can isolated operation
To realize the application, it also can access network and this Shen realized by the interactive operation with other computer equipments in network
Please.Wherein, the network residing for the computer equipment includes but is not limited to internet, wide area network, Metropolitan Area Network (MAN), LAN, VPN nets
Network etc..
It should be noted that the user equipment, the network equipment and network etc. are only for example, other are existing or from now on may be used
The computer equipment or network that can occur such as are applicable to the application, should also be included within the application protection domain, and to draw
It is incorporated herein with mode.
The method (some of them illustrated by flow) discussed herein below can by hardware, software, firmware, in
Between part, microcode, hardware description language or its any combination implement.When with software, firmware, middleware or microcode come real
Shi Shi, to implement the program code of necessary task or code segment can be stored in machine or computer-readable medium (such as
Storage medium) in.(one or more) processor can implement necessary task.
Concrete structure and function detail disclosed herein are only representational, and are for describing showing for the application
The purpose of example property embodiment.But the application can be implemented by many alternative forms, and it is not interpreted as
It is limited only by the embodiments set forth herein.
Although it should be appreciated that may have been used term " first ", " second " etc. herein to describe unit,
But these units should not be limited by these terms.It is used for the purpose of using these terms by a unit and another unit
Make a distinction.For example, in the case of the scope without departing substantially from exemplary embodiment, it is single that first module can be referred to as second
Member, and similarly second unit can be referred to as first module.Term "and/or" used herein above include one of them or
Any and all combination of more listed associated items.
Term used herein above is not intended to limit exemplary embodiment just for the sake of description specific embodiment.Unless
Context clearly refers else, otherwise singulative used herein above "one", " one " also attempt to include plural number.Should also
When understanding, term " comprising " and/or "comprising" used herein above provide stated feature, integer, step, operation,
The presence of unit and/or component, and do not preclude the presence or addition of other one or more features, integer, step, operation, unit,
Component and/or its combination.
It should further be mentioned that in some replaces realization modes, the function/action being previously mentioned can be according to different from attached
The order indicated in figure occurs.For example, depending on involved function/action, the two width figures shown in succession actually may be used
Substantially simultaneously to perform or can perform in a reverse order sometimes.
The application is related to a kind of modularization content editor based on webpage, and the content editor can be based in browser
On the access of particular address is initiated for edit the content element such as such as word, picture, video, and by these contents
Element merges and forms the content of shuffling, and preserves or issue by forms such as webpages.
Fig. 1 shows a kind of interface schematic diagram of the modularization editing machine based on webpage of embodiment according to the application.
Reference picture 1, each interface element can be arranged at same ccf layer, such as ccf layer 200, and the layer can for example include module frame
Frame object adds button control, and module frame object addition button control can be located in button addition column 201, module frame pair
As addition button control includes character module object framework addition button control 201A, the addition button control of picture module object framework
Part 201B, and video module object framework addition button control 201C.Wherein, Web page module editing machine can monitoring users pair
The triggering of each button control, and obtained at certain and corresponding processing is called after button is triggered.For example, trigger each button control energy
In the module frame object embedding region 202 of the lower section of button control, referred to as embedded region, module frame pair corresponding to insertion
As；Such as triggering character module object framework addition button control 201A meeting embedded text content frame object 202A, and hereafter
The picture module object framework addition button control 201B of triggering then can be in content of text object framework 202A distance below
The embedded image content object framework 202B in place.Continue to trigger different addition button controls and can also continue to add other frameworks
Object.
Different contents can be inputted according to the attribute of object framework.For example, content of text object framework can be in framework
Plain text is inputted in object, the text of input can be segmented by various monitoring event handlings, the behaviour such as modification word attribute
Make.The text inputted in same object framework is limited in same frame area.Can be that content of text object framework is set
Determine the limitation of character quantity, and in the character quantity of restriction, the lower edge of automatic extension framework object, and to be newly entered
Content of text can show.
The function of choosing the picture locally preserved can be provided for image content object framework, for example, when editing machine is supervised
Hear that object framework region is clicked, then can trigger ejection layer 280 and click on the local picture buttons control of selection for user,
Ejection layer can not be ejected and directly trigger local picture call function and local picture is entered again so as to eject picture selection forms
Row selection.
Framework is embedded in into html web page using iframe subpage surface functions, primary Javascript can be utilized
Write the ratio of width to height adaptive polo placement logic so that Web page module editing machine can simpler more convenient calling in Webpage
It is and nested.
The communication of editing machine can use the receiver function that primary Javascript writes, towards web browser
The prototype of windows objects calls customized receiver function, realizes the mutual transmission of data.
Web page module editing machine writes binding using primary Javascript and submits function, way of submission from
List is submitted, and is called primary javascript functions transfer to handle automatically when submitting data, is passed through primary javascript
After the checking function write, all modules are converted into object structure and are again converted into json character strings submitting to server.
Module can be provided for the module created and delete function, such as using HTML+JavaScript on the right side of module
Add " X " button in upper angle.
Module frame object-order adjustment function can be provided for editing machine.For example, as shown in fig. 7, can be in each module
The entirety of object framework or a region provide selected button control, and mouse position monitor function.The selected button control
Part for example can be provided in the top of module frame object, and after being triggered, the overall selected S701 of module frame object can be achieved,
And start mouse position monitor function.When mouse position is moved across from a direction center line of another object module object framework
When, then by the exchange S702 of chosen module frame object and object module frame position, and preserve the module frame after exchanging
Frame object-order S703.
Can be with as shown in figure 1, the ccf layer 200 can include content frame order display layer block 300.The content frame
Object-order display layer block 300 can include the thumbnail 301 of content frame object, such as thumbnail 301A, 301B and 301C,
And content frame object-order adjustment button control 302.Content frame object thumbnails can in each is right in order
The content frame object that should be located in the object framework insertion region 202 of ccf layer 200.
Content frame object-order adjustment control 302 is monitored portion, such as mouse is monitored processing and monitored, when the control is touched
During hair, ejection content frame object-order adjustment layer 400.
Content frame object-order adjustment layer 400 includes the breviary module 401 for characterizing content frame object, such as
401A, 401B and 401C, and to the operation button control 403 that the breviary module is operated, such as delete button control
Part 403A, save button control 403B and cancel button control 403C.
Each breviary module is correspondingly embedded in a content frame object in region 202, and each breviary module has
One serial number, order of the corresponding each content frame object in embedded region 202.
The breviary module 401 has respective initial Location Area scope, and monitors processing binding with a variety of operations,
For example, it can monitor processing binding with the selected operation of mouse, relevant position is selected by the monitoring clicked on to mouse
Breviary module.The long-press of mouse can for example be monitored to realize the selection to breviary module, while by monitoring mouse
The mobile change for realizing thumbnail module position regional extent.Enter another target when a current thumbnail module is dragged
During the band of position scope of breviary module, it can be judged whether by some judgment mechanisms by the position of current thumbnail module
The band of position scope for putting regional extent and the target breviary module is interchangeable, or realizes current thumbnail figure in target
The insertion of position.For example, position when if the band of position scope, i.e. mouse initial selected of current thumbnail module can be set
The ordinate of regional extent is put, the band of position scope with target thumbnail, i.e., the breviary module where mouse current location
The ordinate of band of position scope partially overlap, and the abscissa of the band of position scope of current thumbnail module is more than target
The abscissa intermediate value of the band of position scope of thumbnail, then move to current thumbnail module after target thumbnail.
It can show that the profile of various content frame objects reaches in breviary module 401, for example, for word content
Object framework, picture of the profile up to a line word that can be display word content object framework；For image content
Profile described in object framework reaches the small figure that can show the picture；For profile described in video content object framework up to can be with
Show the first frame of the video while increase the picture of play operation icon, in order to for identifying corresponding content frame pair
As.
As shown in Fig. 2 each breviary module 401 there can be the sequence tags for marking its order, such as correspond to respectively
Breviary module 401A, 401B and 401C label 402A, 402B and 402C.These labels show the breviary module institute
Order of the corresponding content frame object in embedded region, after the change in location of any breviary module, then in the content
The order of all breviary modules of renewal in object framework order adjustment layer 400, and according to suitable described in the sequential update after renewal
Sequence label, such as renewal label 402A, 402B and 402C.
Single breviary module can be operated except foregoing, the editor module in the present embodiment can also be right
Multiple breviary modules are operated simultaneously.Fig. 3 shows the multiselect function of breviary module, such as can monitor mouse every
Clicking on to confirm to select multiple breviary modules in the range of the band of position of individual breviary module, for example, it is right as shown in the figure
Breviary module 401A's and 401B is selected.It can be marked after selected by the way that the background color or increase that change the breviary module are selected
Remember " √ " to show the breviary module being selected, to be different from unselected breviary module, as shown in Figure 3.
The method that Fig. 4 shows another multiselect breviary module, i.e., touching first for mouse is listened to by monitoring processing
Region is sent out outside the band of position scope of all breviary modules, and is not released, then shows rectangular selection frame 405,
First summit of the rectangular selection frame originates in the coordinate triggered first of the mouse, and undelivered in mouse triggering
In the case of, the movement for monitoring mouse is handled using monitoring, and using the current location of mouse as rectangular selection frame and described the
One summit immediately changes the size of the rectangular selection frame 405 in cornerwise second summit.The rectangular selection frame 405
After size determines, then all breviary modules held in the range of choice box are selected.
The position adjustment of the breviary module can also be the position adjustment of selected multiple breviary modules.
After the method for use-case as discussed have selected multiple breviary modules, mouse is monitored in the selected contracting by monitoring to handle
Triggering again in sketch map module and do not discharge, the movement of mouse is once again listened for, so as to realize to selected breviary module
Dragging.Can be selected to adjust for example with the position adjustment judgment mechanism as described above for a breviary module
The position of breviary module.Judge whether the band of position scope of current thumbnail module and the target breviary module
Band of position scope is interchangeable.If for example, can set in selected breviary module on the moving direction of mouse
Most preceding breviary module band of position scope ordinate, the band of position scope with target thumbnail, i.e. mouse work as
The ordinate of the band of position scope of breviary module where front position partially overlaps, and the position of the most preceding breviary module
Abscissa intermediate value of the abscissa more than the band of position scope of target thumbnail of regional extent is put, then by all selected breviaries
Module is moved to according to the moving direction of mouse after or before target thumbnail.
Position instruction can be provided for the target location of thumbnail module.For example, before can be by changing target location
The position instruction is presented in the spacing of one breviary module and the latter breviary module.As indicated by finger mark in Fig. 6
Shown in position.The position instruction of other instruction target locations can also be used, in order to which operator has to the target location of reality
Intuitively judge.
Mouse is listened only in the content frame object-order adjustment layer 400 as shown in figure 5, can also be handled by monitoring
Interior movement, after listening to mouse and being moved in the range of the band of position of some breviary module, and stop be more than it is default
Time, such as stopped 200ms, then it can singly go out a content summary layer 406, or be referred to as the summary that suspends because of its suspension characteristic
Layer, the content summary layer can include a certain paragraph of content, i.e., more than the text shown in the thumbnail.
The content summary layer 406 can be set to listen to mouse and leave the band of position scope of the breviary module
The content summary layer of the breviary module for leaving then is closed afterwards.The content summary layer 406 can be only to word content framework
Object and title content object framework are set, without to image content object framework and the setting of video content object framework.
As shown in any one width of Fig. 1 to 6, button control can bind corresponding cancellation function.For example, cancel button control
403C can bind the selected function to breviary module.For example, after monitoring processing listens to cancel button control and is triggered, then
Cancel and all breviary module being selected.Such as deletion button control 403A can also bind corresponding deletion function.For example,
After monitoring processing, which listens to deletion button control, to be triggered, then the breviary module currently chosen is deleted.Save button control
Binding is corresponding to preserve function.For example, after monitoring processing listens to save button control and is triggered, then this content frame is closed
Object-order adjustment layer 400, and according to the sequential update institute that breviary module is determined in this content frame object-order adjustment layer
State the order of each content frame object in the insertion region 202 of ccf layer 200, and by the content frame object after update sequence
It is shown in the embedded region.
The order of the thumbnail in the content frame order display layer block 300 of the ccf layer can also be updated simultaneously.
Content frame order display layer block 300 can be arranged to the embedded region alignment, or can be by content
Framework order display layer block 300 is arranged to follow screen scroll, that is, causes content frame order display layer block 300 overall and screen
The top edge of curtain keeps the mode of fixed distance to move.
The control of breviary module in the application is independently of ccf layer.All adjustment confirm by save button control
It is preceding only to be presented in content frame order display layer block 300.
The description of the operation to mouse can extend to any input equipment, as long as in the input equipment operating system
Pointer.For triggering in clear and definite the application, the operation such as move and be not limited to a kind of mouse this input mode, for example, can
To substitute the input of mouse using touchs, the input mode such as gesture, thus mouse trigger, move etc. can be with pointer it is tactile
Hair, mobile etc. are stated.
Each function can be the combined use of a function or multiple functions to realizing in the application, and these functions can be real
Existing function can be arranged to " portion ", for example, can include：
Pointer monitoring portion, for monitoring the various triggerings and movement of pointer；
Framework layer building portion, the ccf layer include module frame object embedding region and in the module frames
At least one module frame object addition control of embedded at least one module frame object in object embedding region, wherein described
Embedded region includes at least two content module object frameworks；The ccf layer also includes content frame object-order display layer
Block, the content frame object display layer block include content frame object-order adjustment button control；
Content frame object-order adjustment layer generating unit, it responds user and adjusts button to the content frame object-order
The triggering ejection content frame object-order adjustment layer of control；Wherein, the content frame object-order adjustment layer includes corresponding
The breviary module of each of the content module object framework and at least one renewal button control；
Thumbnail module attribute adjustment portion, it responds operation of the user to the breviary module, independently of the framework
Layer adjusts the attribute in the content frame object-order adjustment layer of the breviary module until listening to the renewal
The triggering of button control；And
Ccf layer update section, it is closed the content frame object-order adjustment layer and based on the category of the breviary module
Property the renewal ccf layer in the embedded region at least two content modules object framework attribute.
The order adjustment portion of breviary module with：Respond selected monitoring at least one breviary module and to referring to
The monitoring of pin movement, start the function of the dragging to the breviary module；The current location moved the pointer over is defined as to institute
State the target location of the dragging of breviary module；The selected release to pointer is monitored, and responds the release, will be described selected
Breviary module is moved to the target location；According to previous or the latter breviary module the sequence number of the target location
Update the sequence number of the selected breviary module.
Sequence number update section, the target location renewal that it is moved according to the selected breviary module are described selected
The sequence number of the sequence number of breviary module before breviary module and breviary module below.
Pointer is monitored in the range of the band of position of at least one breviary module by first selected portion, the described first selected portion
Triggering；And respond the selected breviary module associated with the band of position scope of the triggering.
Second selected portion, the described second selected portion include monitoring band of position model of the pointer at least one breviary module
First time triggering outside enclosing；And respond first time triggering and monitor the pointer at least one breviary module
Second of triggering outside the scope of the band of position, and should mutually trigger the selected first time triggering for second and touch for second
Rectangle determined by hair selectes all breviary modules within frame.
Sequence tags generating unit, the sequence tags of each of the breviary module are indicated for producing；Wherein, update
The order of the breviary module includes the order of update sequence label.
Summary layer generating unit, for monitoring stop of the pointer in the range of the band of position of the breviary module, when stopping
The time is stayed then to eject summary layer when exceeding preset time.
Content frame order display layer block position setting unit, for setting the content frame order display layer block to follow screen
Curtain rolls.
It shown below the exemplary implementation of each concrete function：
Content frame order display layer block 300:Content frame order display layer block 300 can use javaScript primary
TxtShow () function that grammer is write, this function need configured transmission, and parameter is (object) object that current mouse suspends
(such as text thumbnail), (deposited comprising top (height value above browser of storage currentElement), left in function
Store up the width value apart from browser left of currentElement), the txtWidth width of currentElement word (storage), text (deposit
Store up word) etc. variable, the position that suspended frame show is calculated according to above variable, the general when mouse is suspended on thumbnail element
Suspended frame is shown on the position calculated and " storage word " assignment in suspended frame.
The single choice or multiselect of breviary module：Single choice or multiselect function realize that function is compiled using the primary grammers of JavaScript
The ClickToSelect () function write, function inside Selected variables are used to store web editor module order adjustment layer
The replacement module of interior all content frame objects created, wherein, each is converted into breviary module instead of module, can
It is another inside function intuitively directly to find out very much some content frame object of the thumbnail module represents in this level
One variable ThisAttr is then the selected state instead of breviary module for storing all the elements object framework, is then utilized
IndexOf in the primary grammers of JavaScript obtains the selected state of current thumbnail module, if breviary module is
Clicked on the state of breviary module is then changed to 0 (0 represent do not choose) otherwise selection state was then arranged to 1 (1 is selects
In) choose after the state that is altered to select by the Show Styles of the breviary module be selected to identify this module.It is more
Choosing is then that multiselect can be realized by clicking on one or more breviary module more on the basis of single choice.Wherein described thumbnail mould
Block can be picture element.
Sort method：Sort method uses getSelectedHtml () function that the primary grammers of JavaScript are write,
The built-in variable of function includes selectedArray, that is, the multiple contents of object arrays chosen, click multiselect,
SelectedDataSortArray, that is, the multiple object order attribute arrays chosen, selectedIdArray, that is, selected
In multiple object ID arrays, thisSelected, i.e., current selected state, multiSortFlag, i.e. ordered state,
InsertKeyDom, that is, define dragging object placement anchor point etc..Using the sortable () in jQuerySuperSlide frameworks
+ javaScript realizes binding drag function, and then initialization creates the whether dragged shape of multiSortFlag attribute labelings
State, then the multiSort () function write using javaScript, are bundled in jQuerySuperSlide sort () function
In event, multiStop () function, it is bundled in jQuerySuperSlide stop () function event, the number that will have been sorted
Group is stored in selectedArray variables, finally breviary module, such as picture element, is separately positioned on what is stored
On settlement.
Dragging method：Dragging method uses Sortable drag functions：Built-in attribute includes placeholder and initialized
With specified placeholder options, tolerance, that is, specify whether be covered in when being moved for test event it is another
Pattern, cursor in individual project are that move ordering element or assistant (helper), such cursor always occur, so as to from identical
Position pulled.Coordinate can be provided by the Hash that is combined into of one or two key：{top,left,right,
Bottom }), revert, i.e. whether sortable projects using a smooth animation revert to its new position, delay, i.e.,
Until the time that sequence starts after mouse down, with millisecond meter.The option is unnecessary when can prevent from clicking on some element
Dragging, helper, that is, allow helper element to be used to pull display, scroll, i.e., if provided as true, when to
Can be rolled up to page during edge) scrollSensitivity, that is, define mouse apart from edge how much apart from when start roll,
ScrollSpeed, i.e., when mouse pointer get scrollSensitivity apart from it is interior when, forms roll speed.If
Scroll options are that false then ignores, start is pulled and started function in function, sort draggings, stop dragging end functions, with
Upper attribute coordinates start (), sort (), stop () to call respectively using written in JavaScript after setting
MultiStart () function, multiSort () function, multiStop () function, which are realized, pulls shift position function.
Delete：The multiDeleteSelect () function write using the primary grammers of javaScript utilizes jquery frames
Remove () in frame；Picture element is chosen first with single choice or multiselect function, deletion button control is clicked on after choosing to be touched
This function is sent out, function finds out the element that will delete, point according to the identifier for the element currently chosen in whole elements
General prompting frame is ejected after hitting, display content is " module of deletion will be unable to recover, it is determined that to delete" prompt the user whether
Delete, click on to cancel and do not delete then, click on to delete and then directly delete.
Store method：Store method uses click () function triggering in jQuery frameworks, when click save button control
When call the sortUpdate () write using the primary grammers of javaScript to update all breviary modules, such as picture member
The positional information that element newly moves, the data editted herein are reset on the position after moving, finally preserved simultaneously
Close web editor module order adjustment layer.Current layer is hidden, and shows ccf layer.
It should be noted that the process part of the application can be carried out in the assembly of software and/or software and hardware,
For example, can using application specific integrated circuit (ASIC), general purpose computer or any other realized similar to hardware device.One
In individual embodiment, the software program of the application can realize steps described above or function by computing device.Similarly,
The software program (including related data structure) of the application can be stored in computer readable recording medium storing program for performing, for example, RAM
Memory, magnetically or optically driver or floppy disc and similar devices.In addition, some steps or function of the application can employ hardware to
Realize, for example, coordinating as with processor so as to perform the circuit of each step or function.
In addition, the part of the application can be applied to computer program product, such as computer program instructions, when its quilt
When computer performs, by the operation of the computer, it can call or provide according to the present processes and/or technical scheme.
And the programmed instruction of the present processes is called, it is possibly stored in fixed or moveable recording medium, and/or pass through
Broadcast or the data flow in other signal bearing medias and be transmitted, and/or be stored according to described program instruction operation
In the working storage of computer equipment.Here, including a device according to one embodiment of the application, the device includes using
Memory in storage computer program instructions and processor for execute program instructions, wherein, when the computer program refers to
When order is by the computing device, method and/or skill of the plant running based on foregoing multiple embodiments according to the application are triggered
Art scheme.
The representative illustration of the application includes but is not limited to：
1st, a kind of content edition method based on webpage：Including
Structure includes ccf layer, and the ccf layer includes module frame object embedding region and in the module frame
At least one module frame object addition control of embedded at least one module frame object, wherein institute in frame object embedding region
Stating embedded region includes at least two content module object frameworks；The ccf layer also includes content frame object-order display layer
Block, the content frame object display layer block include content frame object-order adjustment button control；
Respond the triggering ejection content frame object-order that user adjusts button control to the content frame object-order
Adjustment layer；Wherein, the content frame object-order adjustment layer includes each of the corresponding content module object framework
Breviary module and at least one renewal button control；
Operation of the user to the breviary module is responded, is existed independently of the ccf layer adjustment breviary module
The attribute of the content frame object-order adjustment layer is until listen to the triggering to the renewal button control；And
Close the content frame object-order adjustment layer and the attribute based on the breviary module updates the framework
The attribute of at least two content modules object framework in the embedded region in layer.
2nd, the content edition method based on webpage according to example 1, it is characterised in that：
The operation to the breviary module includes the order adjustment of breviary module, wherein, the breviary artwork
The order adjustment of block includes：
The selected monitoring at least one breviary module and the monitoring to pointer movement are responded, is started to the contracting
The function of the dragging of sketch map module；
The current location moved the pointer over is defined as the target location of the dragging to the breviary module；
The selected release to pointer is monitored, and responds the release, the selected breviary module is moved to described
Target location；
The selected thumbnail is updated according to previous or the latter breviary module the sequence number of the target location
The sequence number of module.
3rd, the content edition method based on webpage according to example 2, it is characterised in that：According to the selected breviary
The target location of module movement updates the sequence number of the breviary module before the selected breviary module with after
The sequence number of the breviary module in face.
4th, the content edition method based on webpage according to example 2, it is characterised in that：It is described selected to include monitoring and refer to
Triggering of the pin in the range of the band of position of at least one breviary module；And respond the triggering and select and the band of position
The associated breviary module of scope.
5th, the content edition method based on webpage according to example 2, it is characterised in that：It is described selected to include monitoring and refer to
First time triggering of the pin outside the band of position scope of at least one breviary module；And respond first time triggering and monitor
Second outside the band of position scope of at least one breviary module triggering of the pointer, and mutually should second
Rectangle determined by the secondary selected first time triggering of triggering and second of triggering selectes all breviary modules within frame.
6th, the content edition method based on webpage according to example 2, it is characterised in that：The breviary module it is every
One sequence tags for all including indicating its order；Wherein, updating the order of the breviary module includes update sequence label
Order.
7th, the content edition method based on webpage according to example 2, it is characterised in that：Also include monitoring pointer in institute
The stop in the range of the band of position of breviary module is stated, summary layer is then ejected when the residence time exceeding preset time.
8th, the content edition method based on webpage according to example 1, it is characterised in that：Can be in breviary module
Show that the profile of various content frame objects reaches, wherein, for word content object framework, it can be aobvious that the profile, which reaches,
Show the picture of a line word of word content object framework；This can be shown by being reached for profile described in image content object framework
The small figure of picture；The first frame of the video can be shown while increase broadcasting by being reached for profile described in video content object framework
The picture of handle icon.
9th, the content edition method based on webpage according to example 1, it is characterised in that：By content frame order
Display layer block is arranged to follow screen scroll.
10th, the content edition method based on webpage according to example 9, it is characterised in that：The content frame is suitable
Sequence display layer block is arranged to follow screen scroll to include causing the overall top edge with screen of content frame order display layer block
The mode of fixed distance is kept to move.
11st, a kind of content editing systems based on webpage：Including
Pointer monitoring portion, for monitoring the various triggerings and movement of pointer；
Framework layer building portion, the ccf layer include module frame object embedding region and in the module frames
At least one module frame object addition control of embedded at least one module frame object in object embedding region, wherein described
Embedded region includes at least two content module object frameworks；The ccf layer also includes content frame object-order display layer
Block, the content frame object display layer block include content frame object-order adjustment button control；
Content frame object-order adjustment layer generating unit, it responds user and adjusts button to the content frame object-order
The triggering ejection content frame object-order adjustment layer of control；Wherein, the content frame object-order adjustment layer includes corresponding
The breviary module of each of the content module object framework and at least one renewal button control；
Thumbnail module attribute adjustment portion, it responds operation of the user to the breviary module, independently of the framework
Layer adjusts the attribute in the content frame object-order adjustment layer of the breviary module until listening to the renewal
The triggering of button control；And
Ccf layer update section, it is closed the content frame object-order adjustment layer and based on the category of the breviary module
Property the renewal ccf layer in the embedded region at least two content modules object framework attribute.
12nd, the content editing systems based on webpage according to example 11, it is characterised in that：
Also including breviary module order adjustment portion with：
The selected monitoring at least one breviary module and the monitoring to pointer movement are responded, is started to the contracting
The function of the dragging of sketch map module；
The current location moved the pointer over is defined as the target location of the dragging to the breviary module；
The selected release to pointer is monitored, and responds the release, the selected breviary module is moved to described
Target location；
The selected thumbnail is updated according to previous or the latter breviary module the sequence number of the target location
The sequence number of module.
13rd, the Edition Contains method, system based on webpage according to example 12, it is characterised in that：Sequence number update section, its
The target location moved according to the selected breviary module updates the contracting before the selected breviary module
The sequence number of the sequence number of sketch map module and breviary module below.
14th, the content editing systems based on webpage according to example 12, it is characterised in that：It is selected also to include first
Triggering of the pointer in the range of the band of position of at least one breviary module is monitored in portion, the described first selected portion；And response
The selected breviary module associated with the band of position scope of the triggering.
15th, the content editing systems based on webpage according to example 12, it is characterised in that：It is selected also to include second
Portion, the described second selected portion touch including monitoring first time of the pointer outside the band of position scope of at least one breviary module
Hair；And respond first time triggering and monitor the pointer outside the band of position scope of at least one breviary module
Second of triggering, and mutually second should trigger rectangle choosing determined by the selected first time triggering and second of triggering
Determine all breviary modules within frame.
16th, the content editing systems based on webpage according to example 12, it is characterised in that：Also include sequence tags to produce
Life portion, for producing the sequence tags for the order of each for indicating the breviary module；Wherein, the breviary artwork is updated
The order of block includes the order of update sequence label.
17th, the content editing systems based on webpage according to example 12, it is characterised in that：Also include summary layer to produce
Portion, for monitoring stop of the pointer in the range of the band of position of the breviary module, exceed preset time when the residence time
When then eject summary layer.
18th, the content editing systems based on webpage according to example 11, it is characterised in that：In the breviary module
Profile including various content frame objects reaches, wherein, for word content object framework, it can be aobvious that the profile, which reaches,
Show the picture of a line word of word content object framework；This can be shown by being reached for profile described in image content object framework
The small figure of picture；The first frame of the video can be shown while increase broadcasting by being reached for profile described in video content object framework
The picture of handle icon.
19th, the content editing systems based on webpage according to example 11, it is characterised in that：It is suitable also to include content frame
Sequence display layer block position setting unit, for setting the content frame order display layer block to follow screen scroll.
20th, the content editing systems based on webpage according to example 19, it is characterised in that：Content frame order is shown
Layer block position setting unit includes causing content frame order display layer block is overall to keep fixed distance with the top edge of screen
Mode move.
21st, a kind of computer-readable medium, sequence of computer instructions, the computing device computer instruction are stored thereon with
Sequence can realize at least one of example 1-10 method.
Claims (10)
- A kind of 1. content edition method based on webpage：IncludingCcf layer is built, the ccf layer includes module frame object embedding region and for embedding in the module frame object Enter at least one module frame object addition control of embedded at least one module frame object in region, wherein the embedded area Domain includes at least two content module object frameworks；The ccf layer also includes content frame object-order display layer block, described Content frame object display layer block includes content frame object-order adjustment button control；Respond the triggering ejection content frame object-order adjustment that user adjusts button control to the content frame object-order Layer；Wherein, the content frame object-order adjustment layer includes the breviary of each of the corresponding content module object framework Module and at least one renewal button control；Operation of the user to the breviary module is responded, independently of the ccf layer adjustment breviary module described The attribute of content frame object-order adjustment layer is until listen to the triggering to the renewal button control；AndClose the content frame object-order adjustment layer and the attribute based on the breviary module is updated in the ccf layer The embedded region at least two content modules object framework attribute.
- 2. the content edition method according to claim 1 based on webpage, it is characterised in that：The operation to the breviary module includes the order adjustment of breviary module, wherein, the breviary module Order adjustment includes：The selected monitoring at least one breviary module and the monitoring to pointer movement are responded, is started to the thumbnail The function of the dragging of module；The current location moved the pointer over is defined as the target location of the dragging to the breviary module；The selected release to pointer is monitored, and responds the release, the selected breviary module is moved to the target Position；The selected breviary module is updated according to previous or the latter breviary module the sequence number of the target location Sequence number.
- 3. the content edition method according to claim 2 based on webpage, it is characterised in that：According to the selected breviary The target location of module movement updates the sequence number of the breviary module before the selected breviary module with after The sequence number of the breviary module in face.
- 4. the content edition method according to claim 2 based on webpage, it is characterised in that：It is described selected to include monitoring and refer to Triggering of the pin in the range of the band of position of at least one breviary module；And respond the triggering and select and the band of position The associated breviary module of scope.
- 5. the content edition method according to claim 2 based on webpage, it is characterised in that：It is described selected to include monitoring and refer to First time triggering of the pin outside the band of position scope of at least one breviary module；And respond first time triggering and monitor Second outside the band of position scope of at least one breviary module triggering of the pointer, and mutually should second Rectangle determined by the secondary selected first time triggering of triggering and second of triggering selectes all breviary modules within frame.
- 6. the content edition method according to claim 2 based on webpage, it is characterised in that：The breviary module it is every One sequence tags for all including indicating its order；Wherein, updating the order of the breviary module includes update sequence label Order.
- 7. the content edition method according to claim 2 based on webpage, it is characterised in that：Also include monitoring pointer in institute The stop in the range of the band of position of breviary module is stated, summary layer is then ejected when the residence time exceeding preset time.
- 8. the content edition method according to claim 1 based on webpage, it is characterised in that：Can be in breviary module Show that the profile of various content frame objects reaches, wherein, for word content object framework, it can be aobvious that the profile, which reaches, Show the picture of a line word of word content object framework；This can be shown by being reached for profile described in image content object framework The small figure of picture；The first frame of the video can be shown while increase broadcasting by being reached for profile described in video content object framework The picture of handle icon.
- A kind of 9. content editing systems based on webpage：IncludingPointer monitoring portion, for monitoring the various triggerings and movement of pointer；Framework layer building portion, the ccf layer include module frame object embedding region and in the module frame objects At least one module frame object addition control of embedded at least one module frame object in embedded region, wherein the insertion Region includes at least two content module object frameworks；The ccf layer also includes content frame object-order display layer block, institute Stating content frame object display layer block includes content frame object-order adjustment button control；Content frame object-order adjustment layer generating unit, it responds user and adjusts button control to the content frame object-order Triggering ejection content frame object-order adjustment layer；Wherein, the content frame object-order adjustment layer is included described in correspondence The breviary module of each of content module object framework and at least one renewal button control；Thumbnail module attribute adjustment portion, it responds operation of the user to the breviary module, adjusted independently of the ccf layer The attribute in the content frame object-order adjustment layer of the whole breviary module is until listen to the more new button The triggering of control；AndCcf layer update section, its close described content frame object-order adjustment layer and attribute based on the breviary module more The attribute of at least two content modules object framework in the embedded region in the new ccf layer.
- 10. a kind of computer-readable medium, it is stored thereon with sequence of computer instructions, the computing device sequence of computer instructions The method that at least one of the claim 1-8 can be achieved.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201710467325.4A CN107832318A (en) | 2017-06-20 | 2017-06-20 | Content edition method and system based on webpage |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201710467325.4A CN107832318A (en) | 2017-06-20 | 2017-06-20 | Content edition method and system based on webpage |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN107832318A true CN107832318A (en) | 2018-03-23 |
Family
ID=61643053
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201710467325.4A Pending CN107832318A (en) | 2017-06-20 | 2017-06-20 | Content edition method and system based on webpage |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN107832318A (en) |
Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN102855313A (en) * | 2012-08-24 | 2013-01-02 | 北京壹人壹本信息科技有限公司 | Webpage browsing equipment, webpage abstract generating method and webpage opening method |
| CN103020237A (en) * | 2012-12-14 | 2013-04-03 | 北京新媒传信科技有限公司 | Webpage updating method and device |
| CN104090979A (en) * | 2014-07-23 | 2014-10-08 | 上海天脉聚源文化传媒有限公司 | Method and device for editing webpage |
| US20150081215A1 (en) * | 2000-10-06 | 2015-03-19 | Vederi, Llc | System and method for creating, storing and utilizing images of a geographical location |
-
2017
- 2017-06-20 CN CN201710467325.4A patent/CN107832318A/en active Pending
Patent Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20150081215A1 (en) * | 2000-10-06 | 2015-03-19 | Vederi, Llc | System and method for creating, storing and utilizing images of a geographical location |
| CN102855313A (en) * | 2012-08-24 | 2013-01-02 | 北京壹人壹本信息科技有限公司 | Webpage browsing equipment, webpage abstract generating method and webpage opening method |
| CN103020237A (en) * | 2012-12-14 | 2013-04-03 | 北京新媒传信科技有限公司 | Webpage updating method and device |
| CN104090979A (en) * | 2014-07-23 | 2014-10-08 | 上海天脉聚源文化传媒有限公司 | Method and device for editing webpage |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| US11883743B2 (en) | Information processing method and apparatus, storage medium, and electronic device | |
| CN102356375B (en) | Smooth layout animation of continuous and non-continuous properties | |
| US9952745B2 (en) | Method of modifying rendered attributes of list elements in a user interface | |
| CN104216752B (en) | A kind of information loading method and device based on window | |
| CN102187303B (en) | Object management method and apparatus using touchscreen | |
| US9514557B2 (en) | Representation of operations for making changes to a graph | |
| CN107783702A (en) | Control method, the device and system of display data | |
| CN103473055B (en) | A kind of focus control method for movement and device | |
| US7068288B1 (en) | System and method for moving graphical objects on a computer controlled system | |
| US20030067497A1 (en) | Method and device for modifying a pre-existing graphical user interface | |
| CN102830972A (en) | Multi-webpage browsing device of internet browser | |
| KR20120045744A (en) | An apparatus and method for authoring experience-based learning content | |
| KR102205283B1 (en) | Electro device executing at least one application and method for controlling thereof | |
| CN103116453A (en) | Operation management method and operation management device of graphic object | |
| CN103197876A (en) | Method and apparatus for displaying e-book in terminal having function of e-book reader | |
| CN103577030A (en) | Method and system for displaying interfaces of windows of browsers | |
| CN106200898A (en) | Virtual reality software platform system | |
| CN104699468B (en) | A kind of interface creating method of client and the client | |
| KR20160020486A (en) | Independent hit testing for touchpad manipulations and double-tap zooming | |
| CN106503009A (en) | Show the transfer method and device of data in the page | |
| CN107832318A (en) | Content edition method and system based on webpage | |
| JP2010015521A (en) | Information processor and processing method, program system, and server computer | |
| CN113093961B (en) | Window switching method, storage medium and related equipment | |
| CN110928612B (en) | Display control method and device of virtual resources and electronic equipment | |
| JP4847990B2 (en) | A method for fusing multiple program displays with screen modification |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| RJ01 | Rejection of invention patent application after publication | ||
| RJ01 | Rejection of invention patent application after publication |
Application publication date: 20180323 |