Comments (6)
I cannot reproduce this - I believe it is something from your own css. Try opening the demo that comes with jstree and take a look at "use css to make nodes bigger" demo - I have no white lines.
If you still have the issue - can you please repost the issue with more data about your browser and maybe a snippet?
Kindest regards,
Ivan
from jstree.
Oh, and checkout the latest version :)
from jstree.
I reproduced this problem under ie9. Just add 'overflow-x:auto' to main element for tree and use fixed width. For example:
jQuery("#object-tree").jstree({ ...
..
<div id="object-tree"></div>
..
#object-tree {
overflow-x: auto;
overflow-y: hidden;
}
...
scroll have to be visible.
from jstree.
I'm having exactly this problem, I would guess the "white lines" result from a calculation that fails to account for the scrollbar. I'm using jsTree 1.0-rc3, which I downloaded from www.jstree.com pretty recently. IE is 9.0.8112.
Here's a full example. When the scrollbar is visible, #folder-tree-container gets bigger every time you hover over or out of any node in the tree. Any help appreciated!
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<script src="/javascripts/jquery-1.7.1.min.js" type="text/javascript"></script>
<script src="/javascripts/jstree/jquery.jstree.js" type="text/javascript"></script>
<style type="text/css">
#folder-tree-container {
overflow: auto;
border: 1px solid purple;
margin-bottom: 0;
width: 140px;
}
#folder-tree {
min-height: 40px;
margin: 6px 4px 10px 6px;
border: 1px solid red;
}
</style>
</head>
<body>
<div id="folder-tree-container">
<div id="folder-tree">
<ul>
<li>
<a href="#" id="top">Documents</a>
<ul>
<li>
<a href="#" id="long">Folder with long name to trigger a horizontal scrollbar</a>
</li>
</ul>
</li>
</ul>
</div>
</div>
<script type="text/javascript">
$.jstree._themes = "/javascripts/jstree/themes/";
$('#folder-tree').jstree({
core: { initially_open: [ '#top', '#long' ] },
plugins: [ 'themes', 'html_data', 'ui', 'crrm' ]
});
</script>
</body>
</html>
from jstree.
Just tried that example with a fresh dist/jstree.js (d32013), I can confirm the problem is still there.
Thanks, jstree is great by the way!
from jstree.
Okay, got it - the problem is with IE9 and it's solved here:
Basically adding an 'auto' to any margin on #folder-tree-container magically makes the bug disappear, eg:
#folder-tree-container {
margin: auto 0 0;
}
from jstree.
Related Issues (20)
- Nombre d'entités limitées à 10 HOT 2
- Row double tap event
- Bug overlapping nodes HOT 1
- jstree as a module (ESM) example HOT 2
- Inline Style Conflict with CSP HOT 3
- Cancel node opening with callback style. HOT 2
- Database demo not working at https://www.jstree.com/demo/ HOT 1
- is there some way to load only part of the whole tree?
- Open/close state not reflected on aria-expanded attribute
- `instance.get_json` does not mention the undetermined states (checkbox plugin) HOT 1
- Hide root
- types-plugin: a_attr/li_attr are not merged to nodes
- move node fails if children are all typed to same?
- possible security issues, feedback needed HOT 2
- Node Position Sequence
- Webpack/encore compatibility - $(...).jstree is not a function HOT 1
- Select all button
- The jstree package is vulnerable to Cross-Site Scripting (XSS)
- Massload plugin only loads one time and does not execute 2nd time HOT 1
- How can I resolve the vulnerability in JSTree's get_node flagged by Checkmarx? HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from jstree.